Widget-CircleImageView解析

最新推荐文章于 2021-05-26 21:34:23 发布

小泉诗人

最新推荐文章于 2021-05-26 21:34:23 发布

阅读量281

点赞数

文章标签： widget

Widget-CircleImageView解析

应用程序窗口小部件（Widget）是微小的应用程序视图，可以被嵌入到其它应用程序中（比如桌面）并接收周期性的更新。你可以通过一个App Widget provider来发布一个Widget。可以容纳其它App Widget的应用程序组件被称为App Widget宿主。下面的截屏显示了一个音乐App Widget。

CircleImageView解析
首先、它是继承自ImageView，给ImageView设置图片的方法就是setImageXXX，不管你是用JAVA代码设置，还是在XML里面用src，它最终还是调用JAVA的setImageXXX方法，在这些个方法的最后一定有一个invalidate的方法，让其调用onDraw。

CircleImageView的原理也是这样，声明一个mBitmap这个就是要带到CircleImageView 里面的Bitmap，它的赋值都是在setImageXXX里面做的：

[java] view plain copy
在CODE上查看代码片派生到我的代码片

@Override  
   public void setImageBitmap(Bitmap bm) {  
       super.setImageBitmap(bm);  
       mBitmap = bm;  
       System.out.println("setImageBitmap -- setup");  
       setup();  
   }  

   @Override  
   public void setImageDrawable(Drawable drawable) {  
       super.setImageDrawable(drawable);  
       mBitmap = getBitmapFromDrawable(drawable);  
       System.out.println("setImageDrawable -- setup");  
       setup();  
   }  

   @Override  
   public void setImageResource(int resId) {  
       super.setImageResource(resId);  
       mBitmap = getBitmapFromDrawable(getDrawable());  
       System.out.println("setImageResource -- setup");  
       setup();  
   }  

   @Override  
   public void setImageURI(Uri uri) {  
       super.setImageURI(uri);  
       mBitmap = getBitmapFromDrawable(getDrawable());  
       System.out.println("setImageURI -- setup");  
       setup();  
   }

它们在设置完图片之后必定会调用setup方法，其实这个方法就是一个初始化操作而已，但是在setup的结束地方也调用了invalidate

它巧妙的用这个mBitmap为空，如果这个View还没有被设置图片则不会执行下面的方法，在setup里面有
[java] view plain copy
在CODE上查看代码片派生到我的代码片

private void setup() {  
       if (!mReady) {  
           mSetupPending = true;  
           return;  
       }  
       //这个mBitmap比较妙，只有当有图片被设置以后才会开始执行下面的方法。  
       if (mBitmap == null) {  
           return;  
       }  

       mBitmapShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);  

       mBitmapPaint.setAntiAlias(true);  
       mBitmapPaint.setShader(mBitmapShader);  

       mBorderPaint.setStyle(Paint.Style.STROKE);  
       mBorderPaint.setAntiAlias(true);  
       mBorderPaint.setColor(mBorderColor);  
       mBorderPaint.setStrokeWidth(mBorderWidth);  

       mBitmapHeight = mBitmap.getHeight();  
       mBitmapWidth = mBitmap.getWidth();  

       //整个图像的显示区域：即全部的View大小区域。  
       mBorderRect.set(0, 0, getWidth(), getHeight());  
       //Border的半径为长宽中取小的那一边，android中drawCircle的半径是内圆的半径，不是外圆的半径。  
       mBorderRadius = Math.min((mBorderRect.height() - mBorderWidth) / 2, (mBorderRect.width() - mBorderWidth) / 2);  

       //图片显示的区域：即View的大小区域减去边界的大小。  
       mDrawableRect.set(mBorderWidth, mBorderWidth, mBorderRect.width() - mBorderWidth, mBorderRect.height() - mBorderWidth);  
       //图片的半径大小取图片小边。  
       mDrawableRadius = Math.min(mDrawableRect.height() / 2, mDrawableRect.width() / 2);  

       updateShaderMatrix();  
       invalidate();  
   }

这个方法应当是在onMeasure之后调用的，我们知道图片设置成功之后，一定是在onMeasure之后，
所以它并没有逃脱自定义控件的的逻辑（1、重写onMeasure计算或者设置一些高度、宽度等数据，2、重写onDraw 3、重写onTouch做一些事件处理或者计算），它只是通过一个mBitmap的防空来判断它是在绘制成功之后的做的事情。

再看看onDraw就更加明白了。

这个onDraw也是利用如果图片不存在就不画它，这是一个十分巧妙的判断。

[java] view plain copy
在CODE上查看代码片派生到我的代码片

@Override  
   protected void onDraw(Canvas canvas) {  
    System.out.println("onDraw before setup");  
       if (getDrawable() == null) {  
           return;  
       }  
       System.out.println("onDraw after setup");  
       canvas.drawCircle(getWidth() / 2, getHeight() / 2, mDrawableRadius, mBitmapPaint);  
       if (mBorderWidth != 0) {  
           canvas.drawCircle(getWidth() / 2, getHeight() / 2, mBorderRadius, mBorderPaint);  
       }  

       /**********图片延迟加载时间的各个方法的生命周期(模仿网络图片的加载情况)*****************/  
       //onSizeChanged --> onDraw --> setImageResource --> onDraw  
   }

整体来看思路是这样，这个View显示到页面时，如果没有图片资源其实是一个空画，就是虽然执行了onDraw但是并没有执行实际内容，只有当执行了setImageXXX，这里面是真正有内容了才去onDraw。

BitmapShader：使用一张位图作为纹理对某一区域进行填充，例如我们drawCircle，它就会对这个circle里面进行填充,它的两个参数就是对X，Y轴进行填充的一些规则。

[java] view plain copy
在CODE上查看代码片派生到我的代码片

package de.hdodenhof.circleimageview;  

import android.content.Context;  
import android.content.res.TypedArray;  
import android.graphics.Bitmap;  
import android.graphics.BitmapShader;  
import android.graphics.Canvas;  
import android.graphics.Color;  
import android.graphics.Matrix;  
import android.graphics.Paint;  
import android.graphics.RectF;  
import android.graphics.Shader;  
import android.graphics.drawable.BitmapDrawable;  
import android.graphics.drawable.ColorDrawable;  
import android.graphics.drawable.Drawable;  
import android.net.Uri;  
import android.util.AttributeSet;  
import android.widget.ImageView;  

public class CircleImageView extends ImageView {  

    private static final ScaleType SCALE_TYPE = ScaleType.CENTER_CROP;  

    private static final Bitmap.Config BITMAP_CONFIG = Bitmap.Config.ARGB_8888;  
    private static final int COLORDRAWABLE_DIMENSION = 2;  

    private static final int DEFAULT_BORDER_WIDTH = 0;  
    private static final int DEFAULT_BORDER_COLOR = Color.BLACK;  

    private final RectF mDrawableRect = new RectF();  
    private final RectF mBorderRect = new RectF();  

    private final Matrix mShaderMatrix = new Matrix();  
    private final Paint mBitmapPaint = new Paint();  
    private final Paint mBorderPaint = new Paint();  

    private int mBorderColor = DEFAULT_BORDER_COLOR;  
    private int mBorderWidth = DEFAULT_BORDER_WIDTH;  

    private Bitmap mBitmap;  
    private BitmapShader mBitmapShader;  
    private int mBitmapWidth;  
    private int mBitmapHeight;  

    private float mDrawableRadius;  
    private float mBorderRadius;  

    private boolean mReady;  
    private boolean mSetupPending;  

    public CircleImageView(Context context) {  
        super(context);  

        init();  
    }  

    public CircleImageView(Context context, AttributeSet attrs) {  
        this(context, attrs, 0);  
    }  

    public CircleImageView(Context context, AttributeSet attrs, int defStyle) {  
        super(context, attrs, defStyle);  

        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.CircleImageView, defStyle, 0);  

        mBorderWidth = a.getDimensionPixelSize(R.styleable.CircleImageView_border_width, DEFAULT_BORDER_WIDTH);  
        mBorderColor = a.getColor(R.styleable.CircleImageView_border_color, DEFAULT_BORDER_COLOR);  

        a.recycle();  

        init();  
    }  

    private void init() {  
        super.setScaleType(SCALE_TYPE);  
        mReady = true;  

        if (mSetupPending) {  
            System.out.println("init -- setup");  
            setup();  
            mSetupPending = false;  
        }  
    }  

    @Override  
    public ScaleType getScaleType() {  
        return SCALE_TYPE;  
    }  

    @Override  
    public void setScaleType(ScaleType scaleType) {  
        if (scaleType != SCALE_TYPE) {  
            throw new IllegalArgumentException(String.format("ScaleType %s not supported.", scaleType));  
        }  
    }  

    @Override  
    public void setAdjustViewBounds(boolean adjustViewBounds) {  
        if (adjustViewBounds) {  
            throw new IllegalArgumentException("adjustViewBounds not supported.");  
        }  
    }  

    @Override  
    protected void onDraw(Canvas canvas) {  
        System.out.println("onDraw before setup");  
        if (getDrawable() == null) {  
            return;  
        }  
        System.out.println("onDraw after setup");  
        canvas.drawCircle(getWidth() / 2, getHeight() / 2, mDrawableRadius, mBitmapPaint);  
        if (mBorderWidth != 0) {  
            canvas.drawCircle(getWidth() / 2, getHeight() / 2, mBorderRadius, mBorderPaint);  
        }  

        /**********图片延迟加载时间的各个方法的生命周期(模仿网络图片的加载情况)*****************/  
        //onSizeChanged --> onDraw --> setImageResource --> onDraw  
    }  

    @Override  
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {  
        super.onSizeChanged(w, h, oldw, oldh);  
        System.out.println("onSizeChanged -- setup");  
        setup();  
    }  

    public int getBorderColor() {  
        return mBorderColor;  
    }  

    public void setBorderColor(int borderColor) {  
        if (borderColor == mBorderColor) {  
            return;  
        }  

        mBorderColor = borderColor;  
        mBorderPaint.setColor(mBorderColor);  
        invalidate();  
    }  

    public int getBorderWidth() {  
        return mBorderWidth;  
    }  

    public void setBorderWidth(int borderWidth) {  
        if (borderWidth == mBorderWidth) {  
            return;  
        }  

        mBorderWidth = borderWidth;  
        System.out.println("setBorderWidth -- setup");  
        setup();  
    }  

    @Override  
    public void setImageBitmap(Bitmap bm) {  
        super.setImageBitmap(bm);  
        mBitmap = bm;  
        System.out.println("setImageBitmap -- setup");  
        setup();  
    }  

    @Override  
    public void setImageDrawable(Drawable drawable) {  
        super.setImageDrawable(drawable);  
        mBitmap = getBitmapFromDrawable(drawable);  
        System.out.println("setImageDrawable -- setup");  
        setup();  
    }  

    @Override  
    public void setImageResource(int resId) {  
        super.setImageResource(resId);  
        mBitmap = getBitmapFromDrawable(getDrawable());  
        System.out.println("setImageResource -- setup");  
        setup();  
    }  

    @Override  
    public void setImageURI(Uri uri) {  
        super.setImageURI(uri);  
        mBitmap = getBitmapFromDrawable(getDrawable());  
        System.out.println("setImageURI -- setup");  
        setup();  
    }  

    private Bitmap getBitmapFromDrawable(Drawable drawable) {  
        if (drawable == null) {  
            return null;  
        }  

        if (drawable instanceof BitmapDrawable) {  
            return ((BitmapDrawable) drawable).getBitmap();  
        }  

        try {  
            Bitmap bitmap;  

            if (drawable instanceof ColorDrawable) {  
                bitmap = Bitmap.createBitmap(COLORDRAWABLE_DIMENSION, COLORDRAWABLE_DIMENSION, BITMAP_CONFIG);  
            } else {  
                bitmap = Bitmap.createBitmap(drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight(), BITMAP_CONFIG);  
            }  

            Canvas canvas = new Canvas(bitmap);  
            drawable.setBounds(0, 0, canvas.getWidth(), canvas.getHeight());  
            drawable.draw(canvas);  
            return bitmap;  
        } catch (OutOfMemoryError e) {  
            return null;  
        }  
    }  

    private void setup() {  
        if (!mReady) {  
            mSetupPending = true;  
            return;  
        }  
        //这个mBitmap比较妙，只有当有图片被设置以后才会开始执行下面的方法。  
        if (mBitmap == null) {  
            return;  
        }  

        mBitmapShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);  

        mBitmapPaint.setAntiAlias(true);  
        mBitmapPaint.setShader(mBitmapShader);  

        mBorderPaint.setStyle(Paint.Style.STROKE);  
        mBorderPaint.setAntiAlias(true);  
        mBorderPaint.setColor(mBorderColor);  
        mBorderPaint.setStrokeWidth(mBorderWidth);  

        mBitmapHeight = mBitmap.getHeight();  
        mBitmapWidth = mBitmap.getWidth();  

        //整个图像的显示区域：即全部的View大小区域。  
        mBorderRect.set(0, 0, getWidth(), getHeight());  
        //Border的半径为长宽中取小的那一边，android中drawCircle的半径是内圆的半径，不是外圆的半径。  
        mBorderRadius = Math.min((mBorderRect.height() - mBorderWidth) / 2, (mBorderRect.width() - mBorderWidth) / 2);  

        //图片显示的区域：即View的大小区域减去边界的大小。  
        mDrawableRect.set(mBorderWidth, mBorderWidth, mBorderRect.width() - mBorderWidth, mBorderRect.height() - mBorderWidth);  
        //图片的半径大小取图片小边。  
        mDrawableRadius = Math.min(mDrawableRect.height() / 2, mDrawableRect.width() / 2);  

        updateShaderMatrix();  
        invalidate();  
    }  

    private void updateShaderMatrix() {  
        float scale;  
        float dx = 0;  
        float dy = 0;  

        mShaderMatrix.set(null);  

        if (mBitmapWidth * mDrawableRect.height() > mDrawableRect.width() * mBitmapHeight) {  
            scale = mDrawableRect.height() / (float) mBitmapHeight;  
            dx = (mDrawableRect.width() - mBitmapWidth * scale) * 0.5f;  
        } else {  
            scale = mDrawableRect.width() / (float) mBitmapWidth;  
            dy = (mDrawableRect.height() - mBitmapHeight * scale) * 0.5f;  
        }  

        System.out.println("scale "+scale);  
        mShaderMatrix.setScale(scale, scale);  
        mShaderMatrix.postTranslate((int) (dx + 0.5f) + mBorderWidth, (int) (dy + 0.5f) + mBorderWidth);  

        mBitmapShader.setLocalMatrix(mShaderMatrix);  
    }  

}

http://blog.csdn.net/dacainiao007/article/details/43983271

小泉诗人

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Widget-CircleImageView解析

Widget-CircleImageView解析应用程序窗口小部件（Widget）是微小的应用程序视图，可以被嵌入到其它应用程序中（比如桌面）并接收周期性的更新。你可以通过一个App Widget provider来发布一个Widget。可以容纳其它App Widget的应用程序组件被称为App Widget宿主。下面的截屏显示了一个音乐App Widget。CircleImageView解析
复制链接

扫一扫