Animierte Änderung der Hintergrundfarbe der Ansicht unter Android

Question

Wie kann man die Änderung der Hintergrundfarbe einer Ansicht unter Android animieren?

Zum Beispiel:

Ich habe eine Ansicht mit einer roten Hintergrundfarbe. Die Hintergrundfarbe der Ansicht ändert sich zu Blau. Wie kann ich einen sanften Übergang zwischen den Farben erreichen?

Wenn dies mit den Ansichten nicht möglich ist, ist eine Alternative willkommen.

Answer 1

Ich habe festgestellt, dass die Implementierung, die von ArgbEvaluator im Android-Quellcode leistet beste Arbeit beim Übergang von Farben. Wenn ich HSV verwende, springt der Übergang je nach den beiden Farben für mich durch zu viele Farbtöne. Aber bei dieser Methode ist das nicht der Fall.

Wenn Sie einfach nur animieren wollen, verwenden Sie ArgbEvaluator con ValueAnimator wie vorgeschlagen aquí :

ValueAnimator colorAnimation = ValueAnimator.ofObject(new ArgbEvaluator(), colorFrom, colorTo);
colorAnimation.addUpdateListener(new AnimatorUpdateListener() {

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

});
colorAnimation.start();

Wenn es Ihnen jedoch wie mir geht und Sie Ihren Übergang mit einer Benutzergeste oder einem anderen von einer Eingabe übergebenen Wert verknüpfen wollen, können Sie die ValueAnimator ist nicht sehr hilfreich (es sei denn, Sie zielen auf API 22 und höher ab, in diesem Fall können Sie die ValueAnimator.setCurrentFraction() Methode). Wenn Sie unterhalb von API 22 zielen, verpacken Sie den Code, der in ArgbEvaluator Quellcode in Ihrer eigenen Methode, wie unten gezeigt:

public static int interpolateColor(float fraction, int startValue, int endValue) {
    int startA = (startValue >> 24) & 0xff;
    int startR = (startValue >> 16) & 0xff;
    int startG = (startValue >> 8) & 0xff;
    int startB = startValue & 0xff;
    int endA = (endValue >> 24) & 0xff;
    int endR = (endValue >> 16) & 0xff;
    int endG = (endValue >> 8) & 0xff;
    int endB = endValue & 0xff;
    return ((startA + (int) (fraction * (endA - startA))) << 24) |
            ((startR + (int) (fraction * (endR - startR))) << 16) |
            ((startG + (int) (fraction * (endG - startG))) << 8) |
            ((startB + (int) (fraction * (endB - startB))));
}

Und verwenden Sie es, wie Sie wollen.

Answer 2

Basierend auf ademar111190's Antwort Ich habe diese Methode erstellt, die die Hintergrundfarbe einer Ansicht zwischen zwei beliebigen Farben pulsieren wird:

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();
}

Answer 3

Sie können verwenden ArgbEvaluatorCompat Klasse über API 11.

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();
        }
    });
colorAnim.start();