fresco自定义进度条ProgressBarImage

来源:互联网 发布:js文本框获得焦点 编辑:程序博客网 时间:2024/06/06 09:32

第一种:继承drawable

public class ImageLoadingDrawable extends Drawable{    private Paint mRingBackgroundPaint;    private int mRingBackgroundColor;    // 画圆环的画笔    private Paint mRingPaint;    // 圆环颜色    private int mRingColor;    // 半径    private float mRadius;    // 圆环半径    private float mRingRadius;    // 圆环宽度    private float mStrokeWidth;    // 圆心x坐标    private int mXCenter;    // 圆心y坐标    private int mYCenter;    // 总进度    private int mTotalProgress = 10000;    // 当前进度    private int mProgress;    public ImageLoadingDrawable(){        initAttrs();    }    private void initAttrs() {        mRadius = 16;        mStrokeWidth = 4;        mRingBackgroundColor = 0xFFadadad;        mRingColor = 0xFF0EB6D2;        mRingRadius = mRadius + mStrokeWidth / 2;        initVariable();    }    private void initVariable() {        mRingBackgroundPaint = new Paint();        mRingBackgroundPaint.setAntiAlias(true);        mRingBackgroundPaint.setColor(mRingBackgroundColor);        mRingBackgroundPaint.setStyle(Paint.Style.STROKE);        mRingBackgroundPaint.setStrokeWidth(mStrokeWidth);        mRingPaint = new Paint();        mRingPaint.setAntiAlias(true);        mRingPaint.setColor(mRingColor);        mRingPaint.setStyle(Paint.Style.STROKE);        mRingPaint.setStrokeWidth(mStrokeWidth);    }    @Override    public void draw(Canvas canvas) {        drawBar(canvas,mTotalProgress,mRingBackgroundPaint);        drawBar(canvas,mProgress,mRingPaint);    }    private void drawBar(Canvas canvas, int level, Paint paint) {        if (level > 0 ) {            Rect bound= getBounds();            mXCenter = bound.centerX();            mYCenter = bound.centerY();            RectF oval = new RectF();            oval.left = (mXCenter - mRingRadius);            oval.top = (mYCenter - mRingRadius);            oval.right = mRingRadius * 2 + (mXCenter - mRingRadius);            oval.bottom = mRingRadius * 2 + (mYCenter - mRingRadius);            canvas.drawArc(oval, -90, ((float) level / mTotalProgress) * 360, false, paint); //        }    }    @Override    protected boolean onLevelChange(int level) {        mProgress = level;        if(level > 0 && level < 10000) {            invalidateSelf();            return true;        }else {            return false;        }    }    @Override    public void setAlpha(int alpha) {        mRingPaint.setAlpha(alpha);    }    @Override    public void setColorFilter(ColorFilter cf) {        mRingPaint.setColorFilter(cf);    }    @Override    public int getOpacity() {        return DrawableUtils.getOpacityFromColor(this.mRingPaint.getColor());    }}

主要是重写onLevelChange,然后在里面调用invalidateSelf(),而调用invalidateSelf()时,会重绘,调用draw(Canvas canvas)
但是这种方式要自己通过Canvas自己画,有一定的复杂和难度。那就在想是否可以通过一张美工提供的loading图片实现呢?
第二种:使用AnimationDrawable

AnimationDrawable animationDrawable = new AnimationDrawable();            Drawable drawable = mActivity.getResources().getDrawable(R.drawable.loading);            if(drawable != null){                animationDrawable.addFrame(drawable,200);                animationDrawable.setOneShot(false);            }            GenericDraweeHierarchyBuilder hierarchyBuilder = new GenericDraweeHierarchyBuilder(mActivity.getResources());            hierarchyBuilder                    .setProgressBarImage(animationDrawable)                    .setActualImageScaleType(ScalingUtils.ScaleType.CENTER_INSIDE)                    .setFailureImage(mActivity.getResources().getDrawable(R.drawable.empty_photo));            photoView.setHierarchy(hierarchyBuilder.build());

R.drawable.loading是一个xml文件,一般情况下使用AnimationDrawable 需要很多帧图片构成加载动画,这里使用一张图片即可搞定。
loading.xml

<?xml version="1.0" encoding="utf-8"?><animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"    android:drawable="@drawable/spinner_76_inner"    android:pivotX="50%"    android:pivotY="50%"    />

得到AnimationDrawable 之后只要设置给GenericDraweeHierarchy,然后将其配置给SimpleDraweeView就好了

1 0