在Android上对视图背景颜色进行动画处理

#1 楼

我最终找到了解决这个问题的（相当不错的）解决方案！

您可以使用TransitionDrawable来完成此任务。例如，在drawable文件夹中的XML文件中，您可以编写以下内容：

<?xml version="1.0" encoding="UTF-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- The drawables used here can be solid colors, gradients, shapes, images, etc. -->
    <item android:drawable="@drawable/original_state" />
    <item android:drawable="@drawable/new_state" />
</transition>

然后，在XML中获取实际视图，您可以在android:background属性。

此时，您可以执行以下命令在代码中启动过渡：

TransitionDrawable transition = (TransitionDrawable) viewObj.getBackground();
transition.startTransition(transitionTime);

或在反向调用：

transition.reverseTransition(transitionTime);

有关使用Property Animation API的另一种解决方案，请参阅Roman的答案，该解决方案最初发布时尚不可用。

#2 楼

您可以使用新的Property Animation Api进行彩色动画：

int colorFrom = getResources().getColor(R.color.red);
int colorTo = getResources().getColor(R.color.blue);
ValueAnimator colorAnimation = ValueAnimator.ofObject(new ArgbEvaluator(), colorFrom, colorTo);
colorAnimation.setDuration(250); // milliseconds
colorAnimation.addUpdateListener(new AnimatorUpdateListener() {

    @Override
    public void onAnimationUpdate(ValueAnimator animator) {
        textView.setBackgroundColor((int) animator.getAnimatedValue());
    }

});
colorAnimation.start();

为了向后兼容Android 2.x，请使用Jake Wharton的Nine Old Androids库。

在Android M中已弃用getColor方法，因此您有两种选择：



如果使用支持库，则需要替换getColor调用使用：

ContextCompat.getColor(this, R.color.red);

如果不使用支持库，则需要将getColor调用替换为：

getColor(R.color.red);

#3 楼

根据视图获取背景颜色和目标颜色的方式，有几种不同的实现方法。

前两种使用Android Property Animation框架。

在以下情况下使用对象动画器：


您的视图的背景色定义为xml文件中的argb值。
您的视图先前的颜色由view.setBackgroundColor()设置

您的视图的背景色在可绘制对象中定义，没有定义任何额外的属性，例如笔触或转角半径。
您的视图的背景色在可绘制对象中定义，您要删除任何额外的属性（例如笔触或拐角半径），请记住，移除多余的属性不会设置动画。 ，这很少。这意味着将删除可绘制对象中任何多余的背景属性（例如笔触或拐角）。

如果出现以下情况，请使用Value Animator：


您的视图具有背景色在可绘制的图形中定义，该图形也设置了笔触或拐角半径等属性，并且您希望将其更改为在运行时确定的新颜色。 />
您的视图应在部署之前定义的两个可绘制对象之间切换。能够解决问题，因此，如果遇到任何意外的卡顿，您可能会遇到与我相同的错误。

如果要使用StateLists可绘制对象或LayerLists可绘制对象，则必须修改Value Animator示例，否则它将在view.setBackgroundColor行上崩溃。

Object Animator：

视图定义：

<View
    android:background="#FFFF0000"
    android:layout_width="50dp"
    android:layout_height="50dp"/>

创建并使用这样的ColorDrawable。

final ObjectAnimator backgroundColorAnimator = ObjectAnimator.ofObject(view,
                                                                       "backgroundColor",
                                                                       new ArgbEvaluator(),
                                                                       0xFFFFFFFF,
                                                                       0xff78c5f9);
backgroundColorAnimator.setDuration(300);
backgroundColorAnimator.start();

您还可以使用AnimatorInflater从xml中加载动画定义，就像XMight在Android object中所做的那样。Animate动画布局的backgroundColor

Value Animator： br />

<View
    android:background="@drawable/example"
    android:layout_width="50dp"
    android:layout_height="50dp"/>

可绘制的定义：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FFFFFF"/>
    <stroke
        android:color="#edf0f6"
        android:width="1dp"/>
    <corners android:radius="3dp"/>

</shape>

创建并使用ValueAnimator如下：

final ValueAnimator valueAnimator = ValueAnimator.ofObject(new ArgbEvaluator(),
                                                           0xFFFFFFFF,
                                                           0xff78c5f9);

final GradientDrawable background = (GradientDrawable) view.getBackground();
currentAnimation.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {

    @Override
    public void onAnimationUpdate(final ValueAnimator animator) {
        background.setColor((Integer) animator.getAnimatedValue());
    }

});
currentAnimation.setDuration(300);
currentAnimation.start();

可绘制过渡图：

视图定义：

<View
    android:background="@drawable/example"
    android:layout_width="50dp"
    android:layout_height="50dp"/>

可绘制定义：

<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape>
            <solid android:color="#FFFFFF"/>
            <stroke
                android:color="#edf0f6"
                android:width="1dp"/>
            <corners android:radius="3dp"/>
        </shape>
    </item>

    <item>
        <shape>
            <solid android:color="#78c5f9"/>
            <stroke
                android:color="#68aff4"
                android:width="1dp"/>
            <corners android:radius="3dp"/>
        </shape>
    </item>
</transition>

像这样使用TransitionDrawable： />
还有其他制作动画的方法，但这三种可能是最常见的。我通常使用ValueAnimator。

#4 楼

您可以使对象成为动画师。例如，我有一个targetView，我想更改您的背景色：

int colorFrom = Color.RED;
int colorTo = Color.GREEN;
int duration = 1000;
ObjectAnimator.ofObject(targetView, "backgroundColor", new ArgbEvaluator(), colorFrom, colorTo)
    .setDuration(duration)
    .start();

#5 楼

如果您想要这样的彩色动画，



此代码将帮助您：

#6 楼

最好的方法是使用ValueAnimator和ColorUtils.blendARGB

 ValueAnimator valueAnimator = ValueAnimator.ofFloat(0.0f, 1.0f);
 valueAnimator.setDuration(325);
 valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {

              float fractionAnim = (float) valueAnimator.getAnimatedValue();

              view.setBackgroundColor(ColorUtils.blendARGB(Color.parseColor("#FFFFFF")
                                    , Color.parseColor("#000000")
                                    , fractionAnim));
        }
});
valueAnimator.start();

#7 楼

实现此目的的另一种简便方法是使用AlphaAnimation执行淡入。 br />为孩子提供与容器相同的背景
将容器的背景更改为目标颜色
使用AlphaAnimation淡出孩子。
动画完成后删除孩子（使用AnimationListener）

#8 楼

有关XML驱动的动画的文档太可怕了。我搜索了大约几个小时，只是为了在按下按钮时设置按钮的背景色的动画...可悲的是，动画只是一个属性而已：您可以在exitFadeDuration中使用selector： pre class =“ lang-xml prettyprint-override”> <selector xmlns:android="http://schemas.android.com/apk/res/android" android:exitFadeDuration="200"> <item android:state_pressed="true"> <shape android:tint="#3F51B5" /> </item> <item> <shape android:tint="#F44336" /> </item> </selector>

然后就可以将其用作background。无需Java / Kotlin代码。

#9 楼

这是我在基本练习中用于更改背景的方法。我正在使用通过代码生成的GradientDrawables，但是可以进行调整以适应。

使用setCrossFadeEnabled(true)的Android <4.3会导致不良的泛白效果，因此必须使用上述@Roman Minenok ValueAnimator方法将<4.3切换为纯色。

#10 楼

答案有很多方式。您也可以使用ofArgb(startColor,endColor)中的ValueAnimator。

用于API> 21：

int cyanColorBg = ContextCompat.getColor(this,R.color.cyan_bg);
int purpleColorBg = ContextCompat.getColor(this,R.color.purple_bg);

ValueAnimator valueAnimator = ValueAnimator.ofArgb(cyanColorBg,purpleColorBg);
        valueAnimator.setDuration(500);
        valueAnimator.setInterpolator(new LinearInterpolator());
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
              @Override
              public void onAnimationUpdate(ValueAnimator valueAnimator) {
                   relativeLayout.setBackgroundColor((Integer)valueAnimator.getAnimatedValue());
              }
        });
        valueAnimator.start();

#11 楼

这是一个不错的功能，它可以实现以下功能：

public static void animateBetweenColors(final @NonNull View viewToAnimateItsBackground, final int colorFrom,
                                        final int colorTo, final int durationInMs) {
    final ColorDrawable colorDrawable = new ColorDrawable(durationInMs > 0 ? colorFrom : colorTo);
    ViewCompat.setBackground(viewToAnimateItsBackground, colorDrawable);
    if (durationInMs > 0) {
        final ValueAnimator colorAnimation = ValueAnimator.ofObject(new ArgbEvaluator(), colorFrom, colorTo);
        colorAnimation.addUpdateListener(animator -> {
            colorDrawable.setColor((Integer) animator.getAnimatedValue());
            ViewCompat.setBackground(viewToAnimateItsBackground, colorDrawable);
        });
        colorAnimation.setDuration(durationInMs);
        colorAnimation.start();
    }
}

在科特林：

#12 楼

将文件夹动画制作者添加到res文件夹中。 （名称必须是动画师）。添加动画师资源文件。例如res / animator / fade.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:propertyName="backgroundColor"
        android:duration="1000"
        android:valueFrom="#000000"
        android:valueTo="#FFFFFF"
        android:startOffset="0"
        android:repeatCount="-1"
        android:repeatMode="reverse" />
</set>

内部活动Java文件，将其称为

View v = getWindow().getDecorView().findViewById(android.R.id.content);
AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(this, R.animator.fade);
set.setTarget(v);
set.start();

#13 楼

对Kotlin使用以下功能：

private fun animateColorValue(view: View) {
    val colorAnimation =
        ValueAnimator.ofObject(ArgbEvaluator(), Color.GRAY, Color.CYAN)
    colorAnimation.duration = 500L
    colorAnimation.addUpdateListener { animator -> view.setBackgroundColor(animator.animatedValue as Int) }
    colorAnimation.start()
}

通过任何要更改颜色的视图。

#14 楼

我发现在Android源代码中ArgbEvaluator使用的实现在过渡颜色方面表现最佳。使用HSV时，取决于两种颜色，过渡对我来说是通过太多的色调跳跃的。但是，这种方法就不行了。如果您像我一样，并且希望将过渡与输入中传递的某些用户手势或其他值相关联，则ArgbEvaluator并没有太大帮助（除非您的目标对象是API 22及更高版本，在这种情况下，可以使用ValueAnimator方法）。当定位到API 22以下时，将ValueAnimator源代码中找到的代码包装到您自己的方法中，如下所示： >

#15 楼

基于ademar111190的答案，我创建了此方法，该方法将在任意两种颜色之间脉动视图的背景颜色：

private void animateBackground(View view, int colorFrom, int colorTo, int duration) {


    ObjectAnimator objectAnimator = ObjectAnimator.ofObject(view, "backgroundColor", new ArgbEvaluator(), colorFrom, colorTo);
    objectAnimator.setDuration(duration);
    //objectAnimator.setRepeatCount(Animation.INFINITE);
    objectAnimator.addListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animation) {

        }

        @Override
        public void onAnimationEnd(Animator animation) {
            // Call this method again, but with the two colors switched around.
            animateBackground(view, colorTo, colorFrom, duration);
        }

        @Override
        public void onAnimationCancel(Animator animation) {

        }

        @Override
        public void onAnimationRepeat(Animator animation) {

        }
    });
    objectAnimator.start();
}

#16 楼

您可以在API 11之上使用ArgbEvaluatorCompat类。

implementation 'com.google.android.material:material:1.0.0' 


ValueAnimator colorAnim = ValueAnimator.ofObject(new ArgbEvaluatorCompat(), startColor, endColor);
colorAnim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator animation) {
            mTargetColor = (int) animation.getAnimatedValue();
        }
    });
colorAnimation.start();