how to set up an animated toggle button in android

Question

I've created an animated toggle button the way someone did in this SO question. It works fine but there's a little problem, when the layout is first created, my toggle button background is first frame of the animationdrawable (it should be its last frame). Once I tap it for the first time, it works correctly.

EDIT: toggle_pause_anim.xml:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true" >

<item
    android:drawable="@drawable/pause1"
    android:duration="50"/>
...
<item
    android:drawable="@drawable/pause20"
    android:duration="50"/>

</animation-list>

toggle_pause_anim.xml:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="true" >

<item
    android:drawable="@drawable/play1"
    android:duration="50"/>
...
<item
    android:drawable="@drawable/pause20"
    android:duration="50"/>

</animation-list>

toggle_play_pause_anim.xml:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:drawable="@drawable/toggle_play_anim" android:state_checked="false"/>
<item android:drawable="@drawable/toggle_pause_anim" android:state_checked="true"/>

</selector>

toggle_play_pause_bg:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

<item
    android:id="@+android:id/background"
    android:drawable="@android:color/transparent"/>
<item
    android:id="@+android:id/toggle"
    android:drawable="@drawable/toggle_play_pause_anim"/>

</layer-list>

ToggleButton in my layout.xml:

<ToggleButton
    android:id="@+id/play_pause"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/toggle_play_pause_bg"
    android:textOff=""
    android:textOn="" />

And no, I do set checked to false in on create.

Here 'sa video of what I'm getting. The problem is when the layout is first loaded (the icon should be play, not pause). As you see, after first change, it works correctly afterward.

Answer 1

Well, since nobody answered I searched and searched and finally find the solution.

So here's the trick:

ToggleButton in my layout.xml:

<ToggleButton
    android:id="@+id/play_pause"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/toggle_play_pause_anim"
    android:textOff=""
    android:textOn="" />

It turned out that layer drawable was not necessary, and in java code, Iadded these lines in onCreate method:

toggleBtn = (ToggleButton) findViewById(R.id.play_pause);
StateListDrawable stateListDrawable = (StateListDrawable) toggleBtn.getBackground();
AnimationDrawable animationDrawable = (AnimationDrawable) stateListDrawable.getCurrent();
animationDrawable.selectDrawable(animationDrawable.getNumberOfFrames() - 1);

Now it loads and operates just fine.

Answer 2

请添加您的代码，但是似乎您应该在Activity的onCreate方法中使用setChecked（true）或setChecked（false）。