Using a ValueAnimator to make a TextView blink different colors

Question

I want to use a ValueAnimator to make a TextView's text color blink twice between two different colors but I want to create the Animation in XML. I cannot find any examples. Any help will be appreciated.

Update

The code below works perfect. The color changes from black to blue, blue to black, black to blue, and blue to black with 500ms in between each reverse repeat. I'm however trying to get this to work from an animator xml file.

ValueAnimator colorAnim = ObjectAnimator.OfInt(objectToFlash, "textColor", (int)fromColor, (int)toColor);
colorAnim.SetDuration(500);
colorAnim.SetEvaluator(new ArgbEvaluator());
colorAnim.RepeatCount = 3;
colorAnim.RepeatMode = ValueAnimatorRepeatMode.Reverse;

xml

<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
        android:propertyName="textColor"        
        android:duration="500"
        android:valueFrom="@color/black"
        android:valueTo="@color/ei_blue"
        android:repeatCount="3"
        android:repeatMode="reverse" />

Code

ValueAnimator anim = (ObjectAnimator)AnimatorInflater.LoadAnimator(Activity, Resource.Animator.blinking_text);
anim.SetTarget(objectToFlash);

Using xml causes the color of the TextView's text color to change as many times as it can within 500ms.

Update I think what I need are Keyframes to mimic in xml what the OfInt call is doing programmatically. Trying this now but no luck so far.

M-Wajeeh · Answer 1 · 2013-03-23T08:33:14.600

32

Try this:

private static final int RED = 0xffFF8080;
private static final int BLUE = 0xff8080FF;

ValueAnimator colorAnim = ObjectAnimator.ofInt(myTextView, "backgroundColor", RED, BLUE);
        colorAnim.setDuration(3000);
        colorAnim.setEvaluator(new ArgbEvaluator());
        colorAnim.setRepeatCount(ValueAnimator.INFINITE);
        colorAnim.setRepeatMode(ValueAnimator.REVERSE);
        colorAnim.start();

Or try this untested method via xml: *res/animator/property_animator.xml*

<set >

<objectAnimator
    android:propertyName="backgroundColor"
    android:duration="3000"
    android:valueFrom="#FFFF8080"
    android:valueTo="#FF8080FF"
    android:repeatCount="-1"
    android:repeatMode="reverse" />
</set>

now in Java code:

AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(myContext,
R.anim.property_animator);
set.setTarget(myTextView);
set.start();

edited Mar 23 '13 at 08:33

answered Mar 23 '13 at 01:51

M-Wajeeh

17,204
10
66
103

That works, thank you but what would the animator xml look like? – wheels53 Mar 23 '13 at 02:29
also please read http://developer.android.com/guide/topics/resources/animation-resource.html – M-Wajeeh Mar 23 '13 at 08:34
I tried that already using the link you provided before posting. The issue is that the animation behaves completely different using xml versus code directly. I'll update my question with code. – wheels53 Mar 24 '13 at 03:21

score 4 · Answer 2 · answered Nov 13 '16 at 17:46

Starting from API LEVEL > 21 the same effect can be made with static method ObjectAnimator.ofArgb like this:

@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    private void animateText(TextView text) {
        ObjectAnimator animator = ObjectAnimator.ofArgb(text, "textColor", Color.WHITE, Color.RED);
        animator.setDuration(500);
        animator.setRepeatCount(3);
        animator.setRepeatMode(ValueAnimator.REVERSE);
        animator.start();
    }

score 3 · Answer 3 · answered Jan 16 '14 at 19:11

The problem that you describe is that the object animator specified in XML is not correctly assigning the ArgbEvaluator for color interpolation.

To resolve the issue, create the object animator XML to tween between the colors as you desire. Then, in the source code, do the following ensuring that the evaluator used by the animator is an ArgbEvaluator:

ObjectAnimator colorAnimator = (ObjectAnimator)AnimatorInflater.loadAnimator(this, R.animator.color_rotation);
colorAnimator.setTarget(objectToFlash);
colorAnimator.setEvaluator(new ArgbEvaluator());
colorAnimator.start();

Using a ValueAnimator to make a TextView blink different colors

3 Answers3

Linked