为什么缩放动画会改变按钮的大小？

Question

我的Android应用程序中有几个按钮，分别是“开始”、“停止”和“暂停”。当按下“开始”按钮时，它会变为禁用状态，并且“停止”和“暂停”按钮会变为启用状态。同样地，当按下“停止”或“暂停”按钮时，“开始”按钮会再次启用。当这些按钮的状态改变时，我希望使用弹跳动画来进行视觉指示，以向用户表明该按钮现在可用了。问题是，动画实际上正在改变按钮的大小（背景）。查看此GIF以了解我的意思（观看“停止”按钮）： 以下是动画的代码：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/linear_interpolator">

    <scale
        android:fromXScale="1.0"
        android:toXScale="1.1"
        android:fromYScale="1.0"
        android:toYScale="1.1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="200"
        android:repeatCount="0"
        android:repeatMode="reverse" />

</set>

我将其应用于按钮的方式如下：

Animation scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scale_button);
startButton.startAnimation(scaleAnimation);
stopButton.startAnimation(scaleAnimation);

为什么停止按钮的大小会改变，如何防止它发生这种情况？

谢谢！

注意：我最初将动画的“repeatCount”设置为1，以便它可以将按钮缩小。我将其更改为0以调试此问题，但仍然出现相同的情况。

- Shredder2794

Answer 1

我建议不要使用Animation。你必须使用fillEnabled、fillAfter和fillBefore标志来操作，这个API不方便且不直观。

相反，推荐使用Animator的API。

你想要实现的动画看起来像这样：

    val scaleX = ObjectAnimator.ofFloat(view, View.SCALE_X, 1.0f, 1.1f).setDuration(200)
    val scaleY = ObjectAnimator.ofFloat(view, View.SCALE_Y, 1.0f, 1.1f).setDuration(200)
    val downscaleX = ObjectAnimator.ofFloat(view, View.SCALE_X, 1.1f, 1.0f).setDuration(200)
    val downscaleY = ObjectAnimator.ofFloat(view, View.SCALE_Y, 1.1f, 1.0f).setDuration(200)
val set = AnimatorSet()
    set.playTogether(scaleX, scaleY)
    set.play(downscaleX).after(scaleX)
    set.playTogether(downscaleX, downscaleY)
set.start()

或者，你可以使用流畅的API:

    view.animate()
            .scaleXBy(0.1f)
            .scaleYBy(0.1f)
            .setDuration(200)
            .withEndAction {
                view.animate()
                        .scaleXBy(-0.1f)
                        .scaleYBy(-0.1f)
                        .duration = 200
            }

- azizbekian

---

withEndAction接受一个可运行对象作为其参数。 - Vanshaj Daga

Answer 2

您可以简单地通过以下方式实现此目标：

v.animate().scaleX(1.1f).scaleY(1.1f).setDuration(200).withEndAction(new Runnable() {
                    @Override
                    public void run() {
                        v.animate().scaleX(1.0f).scaleY(1.0f).setDuration(200);
                    }
                });

其中“v”是您的视图。
谢谢

- Vanshaj Daga