Clever Geek Handbook

Android: using a selector to change the background image and color of a button

I have a button where I set my background to a specific one selector

.
The selector is currently changing the background of the button and changing the image as the background.
I also want the background color to be changed (the image is an icon with transparent space).
This is a selector:

    <?xml version="1.0" encoding="utf-8"?>
        <selector 
            xmlns:android="http://schemas.android.com/apk/res/android" >
        <!-- default -->
        <item 
            android:state_pressed="false" 
            android:state_focused="false"
            android:drawable="@drawable/menu_button_collapsed" >
        </item>

        <!-- button focused -->
        <item 
            android:state_pressed="false" 
            android:state_focused="true"
            android:drawable="@drawable/menu_button_collapsed_highlight" 
            android:drawable="@drawable/button_background" >
        </item>

       <!-- button pressed -->
        <item 
            android:state_pressed="true" 
            android:state_focused="false"
            android:drawable="@drawable/menu_button_collapsed_highlight"
            android:drawable="@drawable/button_background" >
        </item>
    </selector>

As you can see, I am setting the attribute twice drawable

, which is illegal, but this is what I really want. Note @drawable/button_background

is only color

+3


source to share


2 answers


Create a new <layer-list>

drawable

custom_button.xml

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

           <!-- Your background color goes first -->
           <item 
             android:id="@android:id/background"
             android:drawable="@drawable/button_background" />

           <!-- Your button icon image -->
           <item 
             android:id="@android:id/button_image"
             android:drawable="@drawable/menu_button_collapsed_highlight" />

        </layer-list>


And reference it in your file for selector selection

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

        <!-- default -->
        <item 
            android:state_pressed="false" 
            android:state_focused="false"
            android:drawable="@drawable/menu_button_collapsed" 
         />            

        <!-- button focused -->
        <item 
            android:state_pressed="false" 
            android:state_focused="true"
            android:drawable="@drawable/custom_button" 
            />

        <!-- button pressed -->
        <item 
            android:state_pressed="true" 
            android:state_focused="false"
            android:drawable="@drawable/custom_button" 
         />
    </selector>
+3


source 


<!-- default -->
<item
    android:state_pressed="false"
    android:state_focused="false">
    <shape
        android:innerRadiusRatio="1"
        android:shape="rectangle" >
        <solid android:color="#01AF7E" />
        <corners
            android:bottomLeftRadius="5dp"
            android:bottomRightRadius="5dp"
            android:radius="5dp"
            android:topLeftRadius="5dp"
            android:topRightRadius="5dp"></corners>
        <padding
            android:bottom="10dp"
            android:left="10dp"
            android:right="10dp"
            android:top="10dp" />

    </shape></item>

<!-- button focused -->
<item
    android:state_pressed="false"
    android:state_focused="true">
    <shape
        android:innerRadiusRatio="1"
        android:shape="rectangle" >
        <solid android:color="#8001AF7E" />
        <corners
            android:bottomLeftRadius="5dp"
            android:bottomRightRadius="5dp"
            android:radius="5dp"
            android:topLeftRadius="5dp"
            android:topRightRadius="5dp"></corners>
        <padding
            android:bottom="10dp"
            android:left="10dp"
            android:right="10dp"
            android:top="10dp" />

    </shape></item>

<!-- button pressed -->
<item
    android:state_pressed="true"
    android:state_focused="false">
    <shape
        android:innerRadiusRatio="1"
        android:shape="rectangle" >
        <solid android:color="#8001AF7E" />
        <corners
            android:bottomLeftRadius="5dp"
            android:bottomRightRadius="5dp"
            android:radius="5dp"
            android:topLeftRadius="5dp"
            android:topRightRadius="5dp"></corners>
        <padding
            android:bottom="10dp"
            android:left="10dp"
            android:right="10dp"
            android:top="10dp" />

    </shape></item>


0


source






More articles:


All Articles