美文网首页viewAndroid开发
Drawable + Animatable实现动画

Drawable + Animatable实现动画

作者: 大批 | 来源:发表于2017-03-18 11:47 被阅读105次

    看看效果

    Demo效果图

    总体的实现思路

    • 用一个View(ImageView)容器来呈现动画
    • ImageView设置一个Drawable(在这个drawable里面实现所有的绘制逻辑)
    • 实现动画的效果的核心就是,当ImageView调用Drawable的draw(系统自动调用)方法的时候再次调用ImageView的重绘方法就实现了动画效果了

    看看这个demo的实现

    • 重写了一个ImageView仅仅就是为了设置一个Drawable,不用重写也可以。
    public class LoadingView extends ImageView{
    
        public LoadingView(Context context) {
            super(context);
            setImageDrawable(new LoadingDrawable(this));
        }
    
        public LoadingView(Context context, @Nullable AttributeSet attrs) {
            super(context, attrs);
            setImageDrawable(new LoadingDrawable(this));
        }
    
        public LoadingView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            setImageDrawable(new LoadingDrawable(this));
        }
    
    }
    
    • 核心就是这个LoadingDrawable,直接看draw方法吧
    
        @Override
        public void draw(@NonNull Canvas canvas) {
            //默认从左到右
            int width = canvas.getWidth();
            int height = canvas.getHeight();
            int centerX = width / 2;
            int centerY = height / 2;
            //canvas.drawCircle(centerX,centerY,width / 2 - 8,paint);
            for(int i=0;i < lineModels.size();i++){
                drawLine(canvas,lineModels.get(i));
            }
            //updatedata
            contannier.invalidate();
        }
    
    
        @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
        private void drawLine(Canvas canvas, LineModel lineModel){
            int width = canvas.getWidth() / 2;
            int height = canvas.getHeight() / 2;
            paint.setColor(lineModel.color);
            canvas.drawArc(
                    width - lineModel.raudis - strokeWidth,height - lineModel.raudis - strokeWidth,
                    width + lineModel.raudis + strokeWidth,height + lineModel.raudis + strokeWidth,
                    lineModel.start,lineModel.end,
                    false,paint
            );
            lineModel.updata();
        }
    
    - 这里的**drawLine**就是具体的绘制过程,并且在绘制完成之后更新了下次需要绘制的各种信息
    - 绘制完成之后调用了 **ImageView**的**invalidate**方法进行循环绘制
    

    实现思路来自

    [==↓ ] https://github.com/81813780/AVLoadingIndicatorView


    [== ↑] https://github.com/tyrantgit/ExplosionField


    Nothing is certain in this life. The only thing i know for sure is that. I love you and my life. That is the only thing i know. have a good day

    :)

    相关文章

      网友评论

        本文标题:Drawable + Animatable实现动画

        本文链接:https://www.haomeiwen.com/subject/npsunttx.html