Question

我想在按下按钮的同时改变其背景，就像水平进度条一样从左到右填充颜色。

这是检测按下状态的代码：

lateinit var buttonView: View
val cdt = object : CountDownTimer(1000, 100) {
            override fun onTick(millisUntilFinished: Long) {

            }

            override fun onFinish() {
                //do something after being press by 1 sec.
            }
        }

        val onTouchListener = View.OnTouchListener { v, event ->
            buttonView = v
            when (event.action) {
                MotionEvent.ACTION_DOWN -> {
                    (v.background as AnimationDrawable).start()
                    cdt.start()
                }
                MotionEvent.ACTION_UP -> {
                    (v.background as AnimationDrawable).stop()
                    cdt.cancel()
                }

            }
            false
        }

这是我用于按钮的背景：

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    ...items with drawables which colors are in different position. Frame by frame....
</animation-list>

这有效，但是并不顺利。有没有办法有效地做到这一点？像这样？ https://codepen.io/kay8/pen/azKbjN
（可以用Java回答）

Answer 1

对于可绘制对象，我将ClipDrawable作为LayerDrawable的顶层。这将在视觉上像进度条一样工作。

在以下可绘制对象中，剪辑可绘制对象覆盖了仅一个红色矩形的底层。

button_background.xml

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/holo_red_light" />
        </shape>
    </item>
    <item android:id="@+id/clip_drawable">
        <clip
            android:clipOrientation="horizontal"
            android:gravity="start">
            <shape
                android:shape="rectangle">
                <solid android:color="@android:color/black" />
            </shape>
        </clip>
    </item>
</layer-list>

随着剪贴画级别从0（未显示）增加到10,000（覆盖红色矩形的100％），剪贴画的黑色将超过红色矩形。

TimeAnimator可用于为可绘制剪辑的水平设置动画。

此类为侦听器提供了一种简单的回调机制，该机制可与系统中的所有其他动画制作器同步。

这里是一个快速演示。如果要设置动画的持续时间，可以更改onTimeUpdate()以使其对总时间和经过时间敏感。

MainActivity.java

public class MainActivity extends AppCompatActivity implements TimeAnimator.TimeListener {
    private TimeAnimator mAnimator;
    private int mCurrentLevel = 0;
    private ClipDrawable mClipDrawable;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Get a handle on the ClipDrawable that we will animate.
        LayerDrawable layerDrawable = (LayerDrawable) findViewById(R.id.button).getBackground();
        mClipDrawable = (ClipDrawable) layerDrawable.findDrawableByLayerId(R.id.clip_drawable);

        // Set up TimeAnimator to fire off on button click.
        mAnimator = new TimeAnimator();
        mAnimator.setTimeListener(this);
    }

    @Override
    public void onTimeUpdate(TimeAnimator animation, long totalTime, long deltaTime) {
        mClipDrawable.setLevel(mCurrentLevel);
        if (mCurrentLevel >= MAX_LEVEL) {
            mAnimator.cancel();
        } else {
            mCurrentLevel = Math.min(MAX_LEVEL, mCurrentLevel + LEVEL_INCREMENT);
        }
    }

    public void animateButton(View view) {
        if (!mAnimator.isRunning()) {
            mCurrentLevel = 0;
            mAnimator.start();
        }
    }

    private static final int LEVEL_INCREMENT = 400;
    private static final int MAX_LEVEL = 10000;
}

activity_main.xml

<android.support.constraint.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:background="@drawable/button_background"
        android:text="Button"
        android:onClick="animateButton"
        android:textColor="@android:color/white"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

从左到右填充按钮背景

1 个答案: