Android Custom Circle Picture

Recently studied the circular picture control, has been written by someone else's class, write it yourself, found that the canvas to understand more deeply.

Basic ideas:
Custom Circleimageview inherit from ImageView, create a new layer in the canvas, first draw the avatar to be displayed above, then draw a circle mask, set the brush mode: When two images overlap, the image below the cross section is displayed.

The source code is as follows:(just take it with you.)

 PackageCom.lt.DrawDemo;ImportAndroid.content.Context;Importandroid.graphics.*;Importandroid.graphics.drawable.BitmapDrawable;Importandroid.graphics.drawable.Drawable;ImportAndroid.util.AttributeSet;ImportAndroid.widget.ImageView; Public  class circleimageview extends ImageView {    PrivatePaint Mpaint;PrivateXfermode Xfermode; Public Circleimageview(Context context) {Super(context);    Init (); } Public Circleimageview(context context, AttributeSet attrs) {Super(context, attrs);    Init (); } Public void Init() {//Two-layer intersection showing lower levelXfermode =NewPorterduffxfermode (PorterDuff.Mode.DST_IN); Mpaint =NewPaint ();        Mpaint.setcolor (color.red); Mpaint.setfilterbitmap (false);    Mpaint.setxfermode (Xfermode); }@Override    protected void OnDraw(Canvas canvas) {//This place must be blocked        //super.ondraw (canvas);        //Record the current layer        intCount = Canvas.getsavecount ();//Create a new layerCanvas.savelayer (0,0, GetWidth (), GetHeight (),NULL, Canvas.all_save_flag);//Draw a background image, that is, we want to set the avatar, may be square or rectangulardrawable drawable = getdrawable (); Drawable.setbounds (0,0, GetWidth (), getheight ()); Drawable.draw (canvas);//Draw a circular maskCanvas.drawcircle (GetWidth ()/2, GetHeight ()/2, getwidth ()/2, Mpaint);//Return to the previous layer and copy the image drawn on the layer to that layer. Canvas.restoretocount (count);return; }}

before you look at the following source code, you need to understand the following aspects:
1.Xfermode
/**
* Xfermode is the base class for objects, which is C Alled to implement Custom
* "Transfer-modes" in the drawing pipeline. The static function Create (Modes)
* can called to return a instance of any of the predefined subclasses as
* specified in the Modes enum. When a xfermode is assigned to a Paint, then
* objects drawn with that paint has the xfermode applied. The
/*
Xfermode has three subclasses, namely:
Avoidxfermode: Specifies a color and tolerance, forcing paint to avoid drawing on it (or just drawing on it).
Pixelxorxfermode: When you overwrite an existing color, apply a simple pixel XOR operation.
Porterduffxfermode: This is a very powerful conversion mode, and using it, you can use any of the 16 porter-duff rules of the image composition to control how paint interacts with existing canvas images.

In the project, we define:
Private Xfermode Xfermode;
When two images overlap, the image below the overlapping portion is displayed.
Xfermode = new Porterduffxfermode (PorterDuff.Mode.DST_IN);
When you set the Xfernode property to Mpaint, the pattern below the overlapping section is displayed when you draw two images.
Mpaint.setxfermode (Xfermode);
2.onDraw to comment out the Super.ondraw (canvas);
This is because in the OnDraw of ImageView, he himself will draw the SRC image we set. And we don't want him to draw.
3. about how to create a layer and a rollback of a layer
1. Canvas is a canvas, we draw, such as drawcircle (), DrawText (), etc., are painted on the canvas;
2. A canvas can have more than one layer on top of it. You can use Savelayer, Savalayeralpha to create a new layer, and you can use Restore,restoretocount to return to the first few layers. Where layers are managed through "stacks".
3. For canvas and layer specific reference:
Http://blog.sina.com.cn/s/blog_6e51958501013b62.html
http://blog.csdn.net/linghu_java/article/details/8939952
4.demo
http://download.csdn.net/detail/qq_23936173/9515780

Android Custom Circle Picture