Android 滚动/淡入淡出文本以编程方式附加到

Question

我正在构建一款老式类型的 Android 游戏，我想要的其中一件事是“战斗结果文本窗口”，我可以在动作发生时添加文本，以便玩家知道发生了什么。

我目前使用了 textview 和 valueAnimator 来淡出文本：

public void updateCommentary(String updatedText){

    runOnUiThread(new Runnable() {

      @Override
      public void run() {
          ValueAnimator valueAnimator = ValueAnimator.ofFloat(1f, 0f);
          valueAnimator.setDuration(5000);
          valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
              @Override
              public void onAnimationUpdate(ValueAnimator animation) {
                  TextView tv = (TextView) findViewById(R.id.txtRunningCommentary);
                  tv.setText(updatedText);
                  float alpha = (float) animation.getAnimatedValue();
                  tv.setAlpha(alpha);
              }
          });
          valueAnimator.start();
      }
    });
}

这会导致任何更新都会出现和淡出，但如果连续快速调用，以下文本会覆盖已有的内容。

我想做的，是 5 行文本，让我不断添加新的更新，从而将之前的更新推上来，当它们进一步向上时，它们就会淡出。如果足够长的时间没有更新，则让文本自行淡出。最后，在完美的世界中，小部件不会有固定的高度，但了解其中可以容纳多少行，并根据用户的设备/屏幕布局具有所需的功能。

我想过用多个textview来做到这一点，并在函数开始时将textview2的内容移动到textview1中，然后将trextview3移动到textview2中，依此类推，最后将最新更新添加到textview5中 - 但这感觉有限分几点：

• 首先，它的操作看起来非常笨重且效率低下。
• 其次，我希望个别线条会自行消失 - 因此，冗长的更新可能会淡出顶线，同时保持 那里还有剩余的文字。
• 最后，它肯定无法在 自动神奇地缩小或扩展行到用户设备 - 而是始终固定为我设置的文本视图的数量。

我还考虑过添加一个可滚动的垂直线性布局并向其附加新的文本视图...并以某种方式淡出它们并删除它们...但是，再次开始感觉它对于预期的功能来说变得过于复杂？

是否有一个 android 类，我可以用某种方式来实现这一点，或者我的可怕的方式是否和它会得到的一样好？

Answer 1

如果您只需要淡出文本，不需要任何额外的转换或缩放，我有一个小技巧给您：

创建一个渐变背景可绘制，从白色平滑地淡入透明：

bgr_shadow_white_down.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:angle="-90"
        android:endColor="@android:color/transparent"
        android:startColor="@color/white" />
</shape>

您可以创建另一个自下而上淡入淡出的可绘制对象：

bgr_shadow_white_up.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <gradient
        android:angle="90"
        android:endColor="@android:color/transparent"
        android:startColor="@color/white" />
</shape>

然后你可以有这样的布局：

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

    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginHorizontal="10dp"
        tools:text="@tools:sample/lorem/random" />

    <View
        android:layout_width="match_parent"
        android:layout_height="32dp"
        android:background="@drawable/bgr_shadow_white_down" />

    <View
        android:layout_width="match_parent"
        android:layout_height="32dp"
        android:layout_gravity="bottom"
        android:background="@drawable/bgr_shadow_white_up" />
</FrameLayout>

视觉：

您将拥有一个顶部和底部具有淡入淡出效果的 TextView。现在在您的用例中，您可以：

• 有一个这样的 TextView，当附加新行时，将 TextView 向上平移

  lineHeight

  ，以便旧行向上移动，它将被我们的淡入淡出渐变覆盖，并且将完全被白色或白色覆盖当它继续向上移动时，从父级中剪掉。当超时并且没有附加新行时，清除所有内容并重置动画。

• 有一个垂直的LinearLayout，并添加多个TextView到堆栈中，向上平移，同上。超时清除所有内容。