Question

我正在尝试创建一个媒体播放器，并且我想在点击时将播放按钮变换为暂停按钮并再次转换回播放再次单击时按下按钮。这是一张.gif图像，我想在第一次点击时向前播放，然后在第二次点击时向后播放。有许多关于如何在Android中添加图像作为按钮的教程，但没有一个教程讨论按钮与点击时播放的动画。我确信这是支持的，因为我见过类似的应用程序。我想知道这样做的正确方法是什么？所以它不是性能昂贵，而且无论环境如何都能正常工作。如果可能的话，我也会很感激。

更新

作为一个真实的接近我的想法可以是索尼Xperia（特定的Z1或Z Ultra模型）随身听应用程序。这是一张sample图片，可以进一步澄清事情。

Answer 1

您可以使用AnimationDrawable（链接包含示例）。

我没有看到反向播放它的方法，所以你可能会创建其中的两个，一个向前播放图像，一个向后播放。在按钮OnClickListener中，根据需要将drawable设置为一个动画或另一个动画，然后启动（）动画。

要使用此技术，您必须将gif转换为单独的帧。您可以使用大量免费工具来执行此操作。

示例代码：

public class AnimationDrawableButtonActivity extends FragmentActivity {

    private AnimationDrawable[] mAnimations;
    private int mAnimationIndex = 1;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_animation_drawable_button);
        new LoadAnimationTask().executeOnExecutor(AsyncTask.THREAD_POOL_EXECUTOR);
    }

    class LoadAnimationTask extends AsyncTask<Void, Void, AnimationDrawable[]>{


        @Override
        protected AnimationDrawable[] doInBackground(Void... voids) {
            AnimationDrawable[] animations = new AnimationDrawable[2];
            animations[0] = (AnimationDrawable) getResources().getDrawable(R.drawable.play_pause);
            animations[1] = (AnimationDrawable) getResources().getDrawable(R.drawable.play_pause_reverse);
            animations[0].setOneShot(true);
            animations[1].setOneShot(true);
            return animations;
        }

        @Override
        protected void onPostExecute(AnimationDrawable[] animationDrawables) {
            super.onPostExecute(animationDrawables);

            mAnimations = animationDrawables;

            final ImageButton playButton = (ImageButton) findViewById(R.id.btnPlay);
            playButton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    mAnimationIndex = (mAnimationIndex+ 1) %2;
                    playButton.setImageDrawable(mAnimations[mAnimationIndex]);
                    mAnimations[mAnimationIndex].start();
                }
            });
        }
    }
}

play_pause.xml

<?xml version="1.0" encoding="utf-8"?>

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/play_pause_022" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_023" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_024" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_025" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_026" android:duration="@integer/play_pause_duration" />
</animation-list>

play_pause_reverse.xml

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/play_pause_026" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_025" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_024" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_023" android:duration="@integer/play_pause_duration" />
    <item android:drawable="@drawable/play_pause_022" android:duration="@integer/play_pause_duration" />
</animation-list>

ints.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <integer name="play_pause_duration">32</integer>
</resources>

activity_animation_drawable_button.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent">

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnPlay"
        android:layout_gravity="center"
        android:src="@drawable/play_pause_022"
        style="?android:attr/buttonBarButtonStyle"
        android:padding="8dp" />
</FrameLayout>

单击时播放的动画图像按钮

1 个答案: