Question

我有一个RelativeLayout我已经设置drawable的背景。当RelativeLayout被选中时，我能够将RadioButton的背景更改为另一个。<RelativeLayout android:layout_width="80dp" android:layout_height="50dp" android:gravity="center" android:background="@drawable/original" android:id="@+id/rel1"> <RadioButton android:id="@+id/radio" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true"/> </RelativeLayout>。但是当它改变时如何给它动画呢？

代码： activity_main.xml中：

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="#ffffff">
    </solid>
    <corners
        android:radius="50dp">
    </corners>
</shape>

original.xml（绘制）：

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid
        android:color="#2196F3">
    </solid>
    <corners
        android:radius="50dp">
    </corners>
</shape>

pressed.xml：

radio.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                    if(b){
                    relativeLayout.setBackgroundResource(R.drawable.pressed);
                }
            }
        });

Java类：

var randNo = Math.floor(Math.random() * 100) + 2 + "" + new Date().getTime() +  Math.floor(Math.random() * 100) + 2 + (Math.random().toString(36).replace(/[^a-zA-Z]+/g, '').substr(0, 5));

console.log(randNo);

Answer 1

问题归结为以某种方式修剪角落并为布局背景设置动画。因此，理论上，我们可以设置前景可绘制到布局，并使用ArgbEvaluator为背景绘制动画。

转向练习。

看看this answer，作者共享一个可绘制的面具，这对你的问题很方便：

将drawable应用为布局的前景：

<RelativeLayout
    android:id="@+id/layout"
    android:layout_width="match_parent"
    android:layout_height="300dp"
    android:foreground="@drawable/frame"
    android:background="@color/colorAccent" />

在代码中，只要需要执行动画：



    final int from = ContextCompat.getColor(this, R.color.colorAccent);
    final int to   = ContextCompat.getColor(this, R.color.colorPrimary);

    ValueAnimator anim = new ValueAnimator();
    anim.setIntValues(from, to);
    anim.setEvaluator(new ArgbEvaluator());
    anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            view.setBackgroundColor((Integer)valueAnimator.getAnimatedValue());
        }
    });

    anim.setDuration(1000);
    anim.start();

以下是您输出的内容：

如果您想更改框架可绘制的颜色，可以将其包装到xml并应用android:tint。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item >
        <bitmap android:src="@drawable/frame" android:tint="#ccaaff"/>
    </item>
</layer-list>

现在将此drawable设置为布局的前景。

Answer 2

完全可以在代码中实现相同的效果

以编程方式创建带有矩形角的背景

    //Background
    backgroundDrawable = GradientDrawable()
    backgroundDrawable.cornerRadius = rectangleCornerRadius
    backgroundDrawable.shape = GradientDrawable.RECTANGLE
    backgroundDrawable.setColor(rectangleColor)
    background = backgroundDrawable

动画颜色更改

  val objectAnimator = ObjectAnimator.ofObject(backgroundDrawable, "color",
        ArgbEvaluator(),
        Color.parseColor("#FFFFFFFF"), 
        Color.parseColor("#FF78c5f9"))

  objectAnimator .setDuration(1000);
  objectAnimator .start();

动画布局的背景颜色更改

2 个答案: