带重复的背景动画答案

【问题标题】：Background animation with repeat带重复的背景动画
【发布时间】：2016-04-29 00:14:27
【问题描述】：

在我的项目中，我想无限期地为具有大图像图案的背景设置动画，如下所示：

我最初认为使用带有 ValueAnimator 的 Matrix（用于缩放和平移）来创建平移动画，但我不知道如何重复该模式。

这种效果的发展方式是什么？感谢您的帮助。

更新，我的源代码没有重复（注意：在 GIF 动画中，为了表示简单，我水平绘制了图像模式，但实际上我需要垂直平移动画）：

background.setImageResource(R.drawable.background);
background.setScaleType(ScaleType.MATRIX);

ValueAnimator animator = ValueAnimator.ofFloat(0, 1);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    private Matrix matrix = new Matrix();
    @Override public void onAnimationUpdate(ValueAnimator animation) {
        float factor = (Float) animation.getAnimatedValue();
        int width = background.getDrawable().getIntrinsicWidth();
        int height = background.getDrawable().getIntrinsicHeight();
        float scale = (float) background.getWidth() / (float) width;
        matrix.reset();
        matrix.postTranslate(0, -height * factor);
        matrix.postScale(scale, scale);
        background.setImageMatrix(matrix);
    }
});

animator.setInterpolator(new LinearInterpolator());
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setRepeatMode(ValueAnimator.RESTART);
animator.setDuration(10000);
animator.start();

【问题讨论】：

标签： android android-animation android-imageview

【解决方案1】：

我终于扩展了 BitmapDrawable 来覆盖 draw() 方法：

Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.background);
BitmapDrawable drawable = new BitmapDrawable(getResources(), bitmap) {
    @Override
    public void draw(Canvas canvas) {
        super.draw(canvas);
        canvas.drawBitmap(getBitmap(), 0, getIntrinsicHeight(), null);
    }
};

background.setImageDrawable(drawable);
background.setScaleType(ScaleType.MATRIX);

ValueAnimator animator = ValueAnimator.ofFloat(0);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    private Matrix matrix = new Matrix();
    @Override
    public void onAnimationUpdate(ValueAnimator animator) {
        matrix.reset();
        int height = background.getDrawable().getIntrinsicHeight();
        float translate = -height * animator.getAnimatedFraction();
        matrix.postTranslate(0, translate);
        float width = background.getDrawable().getIntrinsicWidth();
        float scale = background.getWidth() / width;
        matrix.postScale(scale, scale);
        background.setImageMatrix(matrix);
    }
});

animator.setInterpolator(new LinearInterpolator());
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setRepeatMode(ValueAnimator.RESTART);
animator.setDuration(10000);
animator.start();

注意：drawable.setTileModeXY(TileMode.REPEAT, TileMode.REPEAT) 不适用于imageView.setScaleType(ScaleType.MATRIX)。

所以我不知道这是否是一个好习惯，但它是我目前发现的唯一一个。如果您有任何改进技术的想法，请分享。

【讨论】：