how can i create a custom button for my android application without the button becoming blurred?

Question

i currently have a working android app which i am programming in eclise, but i want to change the UI and add my own feelp to it, but when i rescale the buttons on a page the outline of the button becomes very blurred, what can i do to fix this?

currently i am setting the background of the button to an xml file called background.xml

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">
     <item android:state_pressed="true"
       android:drawable="@drawable/button_pressed" /> <!-- pressed -->
     <item android:state_enabled="false"
       android:drawable="@drawable/button_disabled"/> <!-- disabled -->
     <item android:state_focused="true"
       android:drawable="@drawable/button_focused" /> <!-- focused -->
     <item android:drawable="@drawable/button_normal" /> <!-- default -->

 </selector>

any ideas to fix the problem would be apreciated.

Here is a photo of the blurred button

ok, ive done the 9patch but now the image has a black line on the inside, any ideas?

Answer 1

I think You need to try 9patch which will not have such scaling issues. Using 9patch tool from Android SDK You can convert existing png drawables into 9patches.

Another way is to use separate resources for separate screens (which would scale properly). However, this would lead to reduction in APK size. Refer to Screens Support topic for more information.

Answer 2

Did You use a Button or an ImageButton? The best way to handle this is to use an imageButton and set scaleType="center" (there are more options for example centerInside or fitXY etc, this belongs to Your needs). You have to read the following article for supporting multiple screen sizes:

http://developer.android.com/guide/practices/screens_support.html