Images not Switching in Android Custom Toggle Button

Question

In my android application, I am trying to make a simple toggle button switching between two images, actually a star to mark as favorites . States of the button are being changed but images are not switching for ON and OFF states. Image of the OFF state is being displayed by default continuously.

I have tried the following tutorials: http://www.coderzheaven.com/2012/05/20/create-custom-toggle-button-android/ http://www.technotalkative.com/android-custom-toggle-button-example/

** togbtn_fav_custom.xml **

<item android:drawable="@drawable/ic_action_important" android:state_checked="true" android:state_pressed="true"/>
<item android:drawable="@drawable/ic_action_important" android:state_checked="true" android:state_focused="false"/>
<item android:drawable="@drawable/ic_action_not_important" android:state_checked="false" android:state_pressed="true"/>
<item android:drawable="@drawable/ic_action_not_important" android:state_checked="false" android:state_focused="false"/>

layout.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 

    >
  <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <LinearLayout
        android:id="@+id/ll_back_single_dua_footer"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:gravity="center_vertical" >

        <Button
            android:id="@+id/btn_play_pause_dua"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:background="@drawable/play_btn_custom" />


        <TextView
            android:id="@+id/tv_back_single_dua_footer_counter"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center_horizontal"
            android:singleLine="true"
            android:text="@string/sample_counter"

            android:textSize="23sp" />

        <ToggleButton
            android:id="@+id/tog_btn_favorite_dua"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
        android:background="@drawable/togbtn_fav_custom"
        android:textOff=""
        android:textOn=""
         />
    </LinearLayout>

    </LinearLayout>

Can anybody please guide me what am I missing?

Answer 1

Try to simplify your selector.xml like this:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/ic_action_not_important" android:state_checked="false"/>
  <item android:drawable="@drawable/ic_action_important" android:state_checked="true"/>
</selector>

And as Achilles said, check line

android:background="@drawable/togbtn_fav_custom"

May be you need to set selector.xml as background?