高级UI特效仿直播点赞效果—一个优美炫酷的点赞动画-白红宇

一个优美炫酷的点赞效果

效果图如下：

攻克难点：

心形图片的路径等走向

心形图片的控制范围

部分代码如下：

通过AbstractPathAnimator定义飘心动画控制器

@Override    public void start(final View child, final ViewGroup parent) {        parent.addView(child, new ViewGroup.LayoutParams(mConfig.heartWidth, mConfig.heartHeight));        FloatAnimation anim = new FloatAnimation(createPath(mCounter, parent, 2), randomRotation(), parent, child);        anim.setDuration(mConfig.animDuration);        anim.setInterpolator(new LinearInterpolator());//启动动画        anim.setAnimationListener(new Animation.AnimationListener() {            @Override            public void onAnimationEnd(Animation animation) {                mHandler.post(new Runnable() {                    @Override                    public void run() {                        parent.removeView(child);                    }                });                mCounter.decrementAndGet();            }            @Override            public void onAnimationRepeat(Animation animation) {            }            @Override            public void onAnimationStart(Animation animation) {                mCounter.incrementAndGet();            }        });        anim.setInterpolator(new LinearInterpolator());        child.startAnimation(anim);    }复制代码

/**     * 根据图片设置bitmap     * @param color     * @return     */    public Bitmap createHeart(int color) {        if (sHeart == null) {            sHeart = BitmapFactory.decodeResource(getResources(), mHeartResId);        }        if (sHeartBorder == null) {            sHeartBorder = BitmapFactory.decodeResource(getResources(), mHeartBorderResId);        }        Bitmap heart = sHeart;        Bitmap heartBorder = sHeartBorder;        Bitmap bm = createBitmapSafely(heartBorder.getWidth(), heartBorder.getHeight());        if (bm == null) {            return null;        }        Canvas canvas = sCanvas;        canvas.setBitmap(bm);        Paint p = sPaint;        canvas.drawBitmap(heartBorder, 0, 0, p);        p.setColorFilter(new PorterDuffColorFilter(color, PorterDuff.Mode.SRC_ATOP));        float dx = (heartBorder.getWidth() - heart.getWidth()) / 2f;        float dy = (heartBorder.getHeight() - heart.getHeight()) / 2f;        canvas.drawBitmap(heart, dx, dy, p);        p.setColorFilter(null);        canvas.setBitmap(null);        return bm;    }复制代码

如何创建一个path

public Path createPath(AtomicInteger counter, View view, int factor) {        Random r = mRandom;        int x = r.nextInt(mConfig.xRand);        int x2 = r.nextInt(mConfig.xRand);        int y = view.getHeight() - mConfig.initY;        int y2 = counter.intValue() * 15 + mConfig.animLength * factor + r.nextInt(mConfig.animLengthRand);        factor = y2 / mConfig.bezierFactor;        //随机xPoint        int xPointFactor = mRandom.nextInt(mConfig.xPointFactor);        x = xPointFactor + x;        x2 = xPointFactor + x2;        int y3 = y - y2;        y2 = y - y2 / 2;        Path p = new Path();        p.moveTo(mConfig.initX, y);        p.cubicTo(mConfig.initX, y - factor, x, y2 + factor, x, y2);        p.moveTo(x, y2);        p.cubicTo(x, y2 - factor, x2, y3 + factor, x2, y3);        return p;    }复制代码

Activity中代码：

项目地址：

攻克难点：

更多文章

相信自己，没有做不到的，只有想不到的