视频直播中的心形漂浮效果

实现效果：

思路：

1.首先要给心形图片创建一个平滑的悬浮路径，那就要用到贝塞尔曲线，这里采用自定义TypeEvaluator实现。
2.路径有了，就要考虑实现动画的两个步骤
a.缩放,伴随透明度变化
b.底部悬浮到顶部
这里是用的是Matrix
3.自定义View，然后绘制心形图片。
详细步骤，看源码

代码：

1.自定义BezierEvaluator

package com.test.paintdemo.loveflyover;import android.animation.TypeEvaluator;import android.graphics.PointF;/** * Created by ygdx_lk on 17/6/26. */public class BezierEvaluator implements TypeEvaluator<PointF> {    private final  PointF p0, p3;    public BezierEvaluator(PointF point0, PointF point3){        this.p0 = point0;        this.p3 = point3;    }    @Override    public PointF evaluate(float t, PointF p1, PointF p2) {        //贝塞尔曲线的三次方公式        PointF pointF = new PointF();        pointF.x = (float) (p0.x * Math.pow((1 - t), 3) + 3 * p1.x * t * Math.pow((1 - t), 2) + 3 * p2.x * Math.pow(t, 2) * (1 - t) + p3.x * Math.pow(t, 3));        pointF.y = (float) (p0.y * Math.pow((1 - t), 3) + 3 * p1.y * t * Math.pow((1 - t), 2) + 3 * p2.y * Math.pow(t, 2) * (1 - t) + p3.y * Math.pow(t, 3));        return pointF;    }}

2.创建FlyOverModel

package com.test.paintdemo.loveflyover;import android.animation.Animator;import android.animation.AnimatorListenerAdapter;import android.animation.AnimatorSet;import android.animation.ValueAnimator;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.Canvas;import android.graphics.Matrix;import android.graphics.Paint;import android.graphics.PointF;import android.view.animation.AccelerateDecelerateInterpolator;import android.view.animation.AccelerateInterpolator;import android.view.animation.AnticipateInterpolator;import android.view.animation.AnticipateOvershootInterpolator;import android.view.animation.DecelerateInterpolator;import android.view.animation.Interpolator;import android.view.animation.LinearInterpolator;import android.view.animation.OvershootInterpolator;import com.test.paintdemo.R;import java.util.Random;/** * Created by ygdx_lk on 17/6/26. */public class FlyOverModel {    private static final String TAG = "FlyOverModel";    private Paint mPaint;    private PointF p0, p1, p2, p3;//p0起点，p1、p2拐点，p3终点    private float love_w, love_h;//爱心的宽高    private Bitmap mBitMap;//图片    private Matrix matrix;    //图片    private int[] resources = {R.drawable.red, R.drawable.blue, R.drawable.yellow};    //差值器    private Interpolator[] interpolator = {new AccelerateDecelerateInterpolator(),            new AnticipateInterpolator(),            new OvershootInterpolator(),            new AnticipateOvershootInterpolator(),            new LinearInterpolator(),            new AccelerateInterpolator(),            new DecelerateInterpolator()    };    public FlyOverModel(final Context context, final int width, final int height, final Invalidate invalidate){        //初始化画笔        mPaint = new Paint();        mPaint.setAntiAlias(true);        //矩阵变换，用来控制图片的缩放位移        matrix = new Matrix();        //三次方贝塞尔曲线：初始化四个点，p0起点，p1、p2拐点，p3终点        p0 = new PointF();        p1 = new PointF();        p2 = new PointF();        p3 = new PointF();        //初始化bitmap        mBitMap = BitmapFactory.decodeResource(context.getResources(), resources[new Random().nextInt(resources.length)]);        //获取bitmap的宽高        love_w = mBitMap.getWidth();        love_h = mBitMap.getHeight();        //p0正好将图片贴底居中显示        p0.x = (width - love_w) / 2;        p0.y = height - love_h;        p2.x = (float) (Math.random() * width);        p2.y = (float) (Math.random() * height / 2);        p1.x = (float) (Math.random() * width);        p1.y = (float) ((1 + Math.random()) * height / 2);        //p3正好图片移出屏幕        p3.x = (float) (Math.random() * width);        p3.y = -love_h;        //缩放动画        ValueAnimator scaleAnimator = ValueAnimator.ofFloat(0, 1);        scaleAnimator.setDuration(1000);        scaleAnimator.setInterpolator(new LinearInterpolator());        scaleAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                //平移到底部                matrix.setTranslate(p0.x, p0.y);                //以图片中心底部为轴，进行缩放                matrix.preScale(animation.getAnimatedFraction(), animation.getAnimatedFraction(), love_w / 2, love_h);                //设置画笔透明度                mPaint.setAlpha((int) (255 * animation.getAnimatedFraction()));                invalidate.invalidate();            }        });        //位移动画        BezierEvaluator bezierEvaluator = new BezierEvaluator(p0, p3);        ValueAnimator valueAnimator = ValueAnimator.ofObject(bezierEvaluator, p1, p2);        valueAnimator.setInterpolator(interpolator[new Random().nextInt(interpolator.length)]);        valueAnimator.setDuration(3000);        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                PointF pointF = (PointF) animation.getAnimatedValue();                matrix.reset();                matrix.setTranslate(pointF.x, pointF.y);                invalidate.invalidate();            }        });        AnimatorSet animatorSet = new AnimatorSet();        animatorSet.play(valueAnimator).after(scaleAnimator);        animatorSet.start();        animatorSet.addListener(new AnimatorListenerAdapter() {            @Override            public void onAnimationEnd(Animator animation) {                //如果动画结束了，重新开始动画                animation.start();                super.onAnimationEnd(animation);            }        });    }    interface Invalidate{        void invalidate();    }    /**     * 绘制bitmap     * @param canvas     */    public void drawBitmap(Canvas canvas){        canvas.drawBitmap(mBitMap, matrix, mPaint);    }}

3.创建自定义View：LoveFlyOver

package com.test.paintdemo.loveflyover;import android.content.Context;import android.graphics.Canvas;import android.support.annotation.Nullable;import android.util.AttributeSet;import android.view.MotionEvent;import android.view.View;import java.util.ArrayList;import java.util.List;/** * Created by ygdx_lk on 17/6/26. */public class LoveFlyOver extends View {    private int width;//控件宽    private int height;//控件高    private static final String TAG = "loveFlyOver";    private List<FlyOverModel> list;    public LoveFlyOver(Context context) {        this(context, null);    }    public LoveFlyOver(Context context, @Nullable AttributeSet attrs) {        super(context, attrs);        list = new ArrayList<>();    }    @Override    protected void onSizeChanged(int w, int h, int oldw, int oldh) {        super.onSizeChanged(w, h, oldw, oldh);        //控件宽高        width = w;        height = h;    }    @Override    public boolean onTouchEvent(MotionEvent event) {        switch (event.getAction()){            case MotionEvent.ACTION_DOWN:                //点击后添加图片                addLove();                break;        }        return super.onTouchEvent(event);    }    private void addLove(int count){        for (int i = 0; i < count; i++) {            addLove();        }    }    //添加心形图片    private void addLove(){        FlyOverModel flyOverModel = new FlyOverModel(getContext(), width, height, new FlyOverModel.Invalidate() {            @Override            public void invalidate() {                postInvalidate();            }        });        list.add(flyOverModel);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        //绘制        for (FlyOverModel item : list) {            item.drawBitmap(canvas);        }    }}