Question

我想创建一个动画，但我不知道如何开始使用它。 Here这张图片。

我希望红色和条纹从左到右动画。（翻译）动画对我来说并不陌生。在屏幕上移动对象很容易，因为我们背后有一个背景。就我而言，它应该是移动的背景。

如果我使用图像，那么在移动到右边时，将无法填充图像留下的空白区域。一个想法是首先用编程方式填充屏幕，从左到右开始移动它们，当一个人开始离开屏幕然后在左边画一个新线但是考虑到条纹不是1px宽我不知道怎么做。

另一种方法是使用比屏幕宽2个条纹的图像。 2条纹在左侧看不见。将图像移动到右侧（动画结束）后，我们重新开始动画。我想知道这是否会导致任何中断，或者它对用户来说是否流畅。

有什么想法吗？我应该使用andengine或类似的东西吗？

Answer 1

您可以使用只为画布绘制矩形的自定义drawable。以下是一个基本示例，只需像

一样使用它

BackgroundDrawable bg = new BackgroundDrawable();
anyView.setBackground(bg);
bg.start();

以下是基本的工作实施：

public class BackgroundDrawable extends Drawable implements Runnable, Animatable {
    private static final long FRAME_DELAY = 1000 / 60;
    private boolean mRunning = false;
    private long mStartTime;
    private int mDuration = 1000;

    private Paint mPaint;
    private int mStripes = 7;


    private void init() {
        if (mPaint == null) {
            mPaint = new Paint();
            mPaint.setColor(Color.WHITE);
            mPaint.setAntiAlias(true);
            mPaint.setStyle(Paint.Style.FILL);
        }
    }

    @Override
    public void draw(Canvas canvas) {
        Rect bounds = getBounds();
        if (isRunning()) {
            // animation in progress
            final int save = canvas.save();

            long timeDiff = SystemClock.uptimeMillis() - mStartTime;
            canvas.clipRect(bounds);

            float progress = ((float) timeDiff) / ((float) mDuration); // 0..1

            float width = bounds.width() / (mStripes * 2);

            for (int i = 0; i < mStripes * 2 + 2; i++) {
                mPaint.setColor(i % 2 == 0 ? Color.RED : Color.WHITE);
                canvas.drawRect(bounds.left + width * (i - 1) + progress * 2 * width, bounds.top, bounds.left + width * i + progress * 2* width, bounds.bottom, mPaint);
            }

            canvas.restoreToCount(save);
        } else {
            // todo draw normal
        }
    }

    @Override
    public void setBounds(int left, int top, int right, int bottom) {
        super.setBounds(left, top, right, bottom);
        init();
    }

    @Override
    public void setAlpha(int alpha) {

    }

    @Override
    public void setColorFilter(ColorFilter colorFilter) {

    }

    @Override
    public int getOpacity() {
        return 0;
    }

    @Override
    public void start() {
        if (mRunning) stop();
        mRunning = true;
        mStartTime = SystemClock.uptimeMillis();
        invalidateSelf();
        scheduleSelf(this, SystemClock.uptimeMillis() + FRAME_DELAY);
    }

    @Override
    public void stop() {
        unscheduleSelf(this);
        mRunning = false;
    }

    @Override
    public boolean isRunning() {
        return mRunning;
    }

    @Override
    public void run() {
        invalidateSelf();
        long uptimeMillis = SystemClock.uptimeMillis();
        if (uptimeMillis + FRAME_DELAY < mStartTime + mDuration) {
            scheduleSelf(this, uptimeMillis + FRAME_DELAY);
        } else {
            mRunning = false;
            start();
        }
    }
}

另外，我在这里写了关于drawables和基本动画处理的详细说明：Custom drawables and animations。

Answer 2

您可以选择自定义视图或自定义drawable，并在onDraw（）方法中在画布上绘制条纹

如何为从左到右移动的全屏条纹设置动画

2 个答案: