Question

i am designing for the button using the icon samples, and wish that when icon is not pressed, it is black, and become white when it is pressed. Coding as follows:

in layout xml:

<Button
     android:layout_height="wrap_content"
     android:layout_width="fill_parent"
     android:layout_weight="1"
     android:background="@drawable/icon_new_btn"
     android:scaleType="fitXY"                
     android:id="@+id/newBtn" />

in icon_new_btn.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true" >         
        <shape xmlns:android="http://schemas.android.com/apk/res/android"> 
            <solid android:drawableTop="@drawable/icon_new_white"
                android:background="@android:color/transparent"/>> 
        </shape>    
    </item>

    <item>
        <shape xmlns:android="http://schemas.android.com/apk/res/android">            
            <solid android:drawableTop="@drawable/icon_new"
                android:background="@android:color/transparent"/>                        
        </shape>
    </item>

</selector>

Question1 (seem to be solved using the below modification):

The whole button becomes invisible on the screen (it can still be pressed at that screen location!). How could I modify the above coding for meeting the purposes defined? Thanks!!

Modification but new Question (Question2):

The following modified layout and selector seem to be solving the above Question 1. Yet the resolution become much poorer and icon distorted and looks bigger. See the below screenshot for the first and second icon using the below modified codes (icon 3 to 6 are simply using android:drawableTop="@drawable/icon_save" without any pressing effect and showing higher resolution):

modified layout

    <Button
            android:layout_height="wrap_content"
            android:layout_width="fill_parent"
            android:layout_weight="1"
            android:background="@drawable/icon_new_btn"
            android:scaleType="fitXY"                
            android:id="@+id/newBtn" /> 

modified selector:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/icon_new_white"
          android:state_pressed="true" />    

    <item android:drawable="@drawable/icon_new" />
</selector>

Answer 1

The reason your graphic is being distored is because it being set as the background. To resolve this, you can instead use an ImageButton:

<ImageButton
        android:layout_height="wrap_content"
        android:layout_width="fill_parent"
        android:layout_weight="1"
        android:src="@drawable/icon_new_btn"
        android:background="@null"
        android:id="@+id/newBtn" /> 

Also, you had specified android:scaleType="fitXY". You might instead want android:scaleType="centerInside".