Android转场动画线性交叉淡入淡出效果

Question

我需要在两个位图上制作交叉淡入淡出效果，第一个位图被第二个位图从上到下线性替换。换句话说，第一个位图应该从上到下消失，第二个位图应该出现在它的位置。有许多使用动画(更改 alpha)或使用 TransitionDrawable 进行淡入淡出的示例，但我找不到我要找的那个。有人知道怎么做吗？

谢谢

Answer 1

我知道，试试这个自定义类:

public class MyView extends View implements View.OnClickListener {

    private Bitmap mBitmap0;
    private Bitmap mBitmap1;
    private Matrix mMatrix;
    private float mY;
    private Rect mRect;

    public MyView(Context context) {
        super(context);
        mBitmap0 = BitmapFactory.decodeResource(getResources(), R.drawable.b0);
        mBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.b1);
        mMatrix = new Matrix();
        mRect = new Rect();
        setOnClickListener(this);
    }

    @Override
        protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        RectF src = new RectF(0, 0, mBitmap0.getWidth(), mBitmap0.getHeight());
        RectF dst = new RectF(0, 0, w, h);
        mMatrix.setRectToRect(src, dst, ScaleToFit.CENTER);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawColor(0xff0000aa);
        canvas.concat(mMatrix);
        Rect r = mRect;
        r.set(0, 0, mBitmap0.getWidth(), (int) (mY * mBitmap0.getHeight()));
        canvas.drawBitmap(mBitmap0, r, r, null);
        r.set(0, (int) (mY * mBitmap1.getHeight()), mBitmap1.getWidth(), mBitmap1.getHeight());
        canvas.drawBitmap(mBitmap1, r, r, null);
    }

    @Override
    public void onClick(View v) {
        TBAnimation anim = new TBAnimation();
        startAnimation(anim);
    }

    class TBAnimation extends Animation {
        public TBAnimation() {
            mY = 0;
            setDuration(2000);
        }

        @Override
        protected void applyTransformation(float interpolatedTime, Transformation t) {
            mY = interpolatedTime;
            invalidate();
        }
    }
}

或者这个(有窄淡出带):

public class MyView extends View implements View.OnClickListener {

    private static final int FADE_HEIGHT = 32;
    private Bitmap mBitmap0;
    private Bitmap mBitmap1;
    private Matrix mMatrix;
    private float mY;
    private Rect mRect;
    private Paint mPaint0;
    private LinearGradient mShader;
    private Paint mPaint1;

    public MyView(Context context) {
        super(context);
        mBitmap0 = BitmapFactory.decodeResource(getResources(), R.drawable.b1);
        mBitmap1 = BitmapFactory.decodeResource(getResources(), R.drawable.b0);
        mMatrix = new Matrix();
        mRect = new Rect();
        mPaint0 = new Paint(Paint.ANTI_ALIAS_FLAG);
        mShader = new LinearGradient(0, 0, 0, FADE_HEIGHT, 0x00ffffff, 0xffffffff, TileMode.CLAMP);
        mPaint0.setShader(mShader);
        mPaint1 = new Paint();
        mPaint1.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
        setOnClickListener(this);
    }

    @Override
        protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        RectF src = new RectF(0, 0, mBitmap0.getWidth(), mBitmap0.getHeight());
        RectF dst = new RectF(0, 0, w, h);
        mMatrix.setRectToRect(src, dst, ScaleToFit.FILL);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        canvas.drawColor(0xff0000aa);
        canvas.concat(mMatrix);
        Rect r = mRect;
        int y = (int) (mY * mBitmap0.getHeight());

        // draw new bitmap on top
        r.set(0, 0, mBitmap0.getWidth(), y + FADE_HEIGHT);
        canvas.drawBitmap(mBitmap0, r, r, null);

        // draw old bitmap strip fading out
        canvas.saveLayer(0, y, mBitmap1.getWidth(), y + FADE_HEIGHT, null, Canvas.ALL_SAVE_FLAG);
        canvas.save();
        canvas.translate(0, y);
        r.set(0, 0, mBitmap1.getWidth(), FADE_HEIGHT);
        canvas.drawRect(r, mPaint0);
        canvas.restore();
        r.set(0, y, mBitmap1.getWidth(), y + FADE_HEIGHT);
        canvas.drawBitmap(mBitmap1, r, r, mPaint1);
        canvas.restore();

        // draw old bitmap on bottom
        r.set(0, y + FADE_HEIGHT, mBitmap1.getWidth(), mBitmap1.getHeight());
        canvas.drawBitmap(mBitmap1, r, r, null);
    }

    @Override
    public void onClick(View v) {
        Bitmap tmp = mBitmap0;
        mBitmap0 = mBitmap1;
        mBitmap1 = tmp;
        TBAnimation anim = new TBAnimation();
        startAnimation(anim);
    }

    class TBAnimation extends Animation {
        public TBAnimation() {
            mY = 0;
            setDuration(3000);
        }

        @Override
        protected void applyTransformation(float interpolatedTime, Transformation t) {
            mY = interpolatedTime;
            invalidate();
        }
    }
}