用动画改变文本视图的背景颜色

Question

我正在开发一个 android 应用程序，我想在单个圆形区域中显示字母，我还需要圆形区域为白色，并且字母表具有我的应用程序的 primaryColor，

这是我的textView：

   <TextView
            android:id="@+id/first"
            android:layout_width="0dip"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="A"
            android:background="@drawable/circle" />

这是drawable 文件夹中circle.xml 的代码：

<?xml version="1.0" encoding="utf-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="oval" >
    <stroke android:width="1dp" android:color="@color/colorPrimaryDark" />
    <gradient android:startColor="@color/white" android :endColor="@color/white"
    android:angle="270"
      />
 </shape>

这是filled_circle的代码：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
  android:shape="oval" >
  <stroke android:width="1dp" android:color="@color/colorPrimaryLight" />
   <gradient android:startColor="@color/colorPrimaryLight" 
      android:endColor="@color/colorPrimaryLight"
    android:angle="270"
    />
</shape>

和java文件中的代码：

 @Override
public void onClick(View v) {


}

问题 当单击字母表的每个文本区域时，白色应该淡出，primaryColor 应该淡入，并带有动画。 有人可以帮忙吗，在 android 4 及更高版本的 animation 库的帮助下完成这项工作？

我目前正在尝试用另一个资源替换 textview 的背景并对其应用动画，但我完全愿意接受任何新的建议和执行此操作的新方式， 我还在上面提供了我当前的代码，但如果我必须进行根本性更改或修改以使其与 animation 库一起使用，请告诉我？

Answer 1

我建议您执行以下操作：

不要尝试在单个背景可绘制对象中为所有内容设置动画。您需要：

<FrameLayout>
  <View/> //Just a view with your white circular background
  <View/> //Another view with circular background, but this one is gonna display the color
  <TextView/> //Centered, your alphabet letter
</FrameLayout>

所以你想把所有这些都放在一个自定义视图中。白色圆形背景视图将保持不变。您可以使用第二个圆形视图来设置字母表的字母颜色。有很多简单的方法可以从自定义可绘制列表层中的层更改颜色（例如 Programmatically change color of shape in layer list）。

当您第一次为自定义视图充气时，您希望将彩色圆形视图的可见性设置为不可见。白色圆形视图将保持可见。 TextView 始终位于顶部。

重写 onClick 方法，使您的自定义视图实现 View.OnClickListener，您应该将代码放在那里运行动画。您唯一需要做的就是制作彩色圆形视图的 alpha 动画，并在 onAnimationEnd() 钩子中将视图的可见性设置为可见。您将需要在自定义视图中使用一个布尔变量来跟踪是否显示了彩色圆圈。这样，如果正在显示彩色圆圈视图并且用户单击它，您可以执行反向动画以仅显示白色圆圈视图。

请记住在自定义视图中执行所有这些操作，以使其保持美观和整洁。还记得添加几个自定义属性，这样您就可以只从 xml 设置彩色圆圈视图的颜色。

我希望这能让您对如何实现它有所了解，IDK 确实有时间举个例子，但是如果您卡在某个地方或者您没有得到我所说的内容，请告诉我。