从左到右连续为文本设置动画 [英] Continuously animate Text from left to right

问题描述

我正在尝试创建一个动画，该动画将TextView从左向右移动并无限循环.这是我要设置动画的TextView:

I'm trying to create an animation which moves a TextView from left to right and loop indefinitely. This is the TextView I want to animate:

<TextView
    android:id="@+id/txtTitle"
    android:layout_width="280dp"
    android:layout_height="wrap_content"
    android:textSize="16sp"
    android:textStyle="italic"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp"
    android:layout_marginTop="20dp"
    android:ellipsize="end"
    android:maxLines="1"
    android:layout_centerHorizontal="true"
    android:layout_below="@id/cardView" />

这就是我尝试为TextView设置动画的方式:

And this how I am trying to animate the TextView:

Animation animation = new TranslateAnimation(0, -280, 0, 0);
animation.setDuration(9000);
animation.setRepeatMode(Animation.RELATIVE_TO_SELF);
animation.setRepeatCount(Animation.INFINITE);
textView.setAnimation(animation);

我想要实现的是使文本从屏幕中央开始，向右移动，并且第一个字母离开屏幕后，它应该重新出现在另一侧.

What I want to achieve is for the text to start out in the center of the screen, move to the right and once the first letter leaves the screen it should reappear on the other side.

推荐答案

您可以通过简单的ValueAnimator轻松实现您想做的事情.

What you want to do can be easily achieved with a simple ValueAnimator.

首先要做的是将要制作动画的TextView的两个相同版本放入布局中.在此示例中，我的布局如下所示:

What you first have to do is put two identical versions of the TextView you want to animate into your layout. In this example my layout looks like this:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/first"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="32sp"
        android:text="@string/hello_word"/>

    <TextView
        android:id="@+id/second"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textSize="32sp"
        android:text="@string/hello_word"/>

</FrameLayout>

然后-正如我已经提到的-您使用ValueAnimator为两个Views的translationX属性设置动画，但是将其中一个偏移屏幕宽度(因为上面的TextViews使用match_parent作为其宽度width等于屏幕的宽度，这就是我将用来偏移其中之一的位置的宽度).您的代码应如下所示:

Then - as I already mentioned - you use a ValueAnimator to animate the translationX property of both Views, but offset one by the width of the screen (since the TextViews above use match_parent as width their width is equal to the width of the screen and that is what I will be using to offset the position of one of them). Your code should look something like this:

final TextView first = (TextView) findViewById(R.id.first);
final TextView second = (TextView) findViewById(R.id.second);

final ValueAnimator animator = ValueAnimator.ofFloat(0.0f, 1.0f);
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setInterpolator(new LinearInterpolator());
animator.setDuration(9000L);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator animation) {
        final float progress = (float) animation.getAnimatedValue();
        final float width = first.getWidth();
        final float translationX = width * progress;
        first.setTranslationX(translationX);
        second.setTranslationX(translationX - width);
    }
});
animator.start();

结果应如下所示:

这篇关于从左到右连续为文本设置动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！