Android 如何实现圆形头像

通常我们再做开发的时候，当需要某种效果的时候，我们通常都是通过Runtime的思维来思考如何实现。什么是runtime思维，其实思考什么时候触发目标的实现，然后在触发点来处理实现的开始。但是在Android中，特别是当需要某种UI的布局，效果的时候，这种Runtime思维通过会让我们使问题复杂化，好的解决方式是把所需的效果实现成具体的widget可以重复用，例如就像此文的CycleImageView。

JAVA Code 实现

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71

public class CycleImageView extends ImageView {           Path path ;      public PaintFlagsDrawFilter mPaintFlagsDrawFilter ; // 毛边过滤      Paint paint ;      public CycleImageView ( Context context , AttributeSet attrs , int defStyle ) {          super ( context , attrs , defStyle ) ;          init ( ) ;      }        public CycleImageView ( Context context , AttributeSet attrs ) {          super ( context , attrs ) ;          init ( ) ;      }        public CycleImageView ( Context context ) {          super ( context ) ;          init ( ) ;      }        public void init ( ) {          paint = new Paint ( ) ;      }        /**      * 重写ImageVIew的draw function      */      @Override      protected void onDraw ( Canvas cns ) {          Drawable drawable = getDrawable ( ) ;          if ( null != drawable ) {              Bitmap bitmap = ( ( BitmapDrawable ) drawable ) . getBitmap ( ) ;              Bitmap b = circleDraw ( bitmap ) ;              final Rect rect1 = new Rect ( 0 , 0 , b . getWidth ( ) , b . getHeight ( ) ) ;              final Rect rect2 = new Rect ( 0 , 0 , getMeasuredWidth ( ) , getMeasuredHeight ( ) ) ;              paint . reset ( ) ;              cns . drawBitmap ( b , rect1 , rect2 , paint ) ;              b . recycle ( ) ;          } else {              super . onDraw ( cns ) ;          }      }        private Bitmap circleDraw ( Bitmap bitmap ) {          int r = 0 ;          int width = bitmap . getWidth ( ) ;          int height = bitmap . getHeight ( ) ;          Rect rectSource = null ;          if ( width > height )                           r = height ;          else          {              r = width ;          }          //创建一个图片对象          Bitmap output = Bitmap . createBitmap ( r , r , Config . ARGB_8888 ) ;          //创建一个图片游标          Canvas canvas = new Canvas ( output ) ;             final Rect rect = new Rect ( 0 , 0 , r , r ) ;             /* 设置取消锯齿效果 */          paint . setAntiAlias ( true ) ;             canvas . drawARGB ( 0 , 0 , 0 , 0 ) ;             paint . setColor ( Color . WHITE ) ;             /* 绘画一个圆图形 */          canvas . drawCircle ( r / 2 , r / 2 , r / 2 , paint ) ;             paint . setXfermode ( new PorterDuffXfermode ( Mode . SRC_IN ) ) ;             canvas . drawBitmap ( bitmap , rect , rect , paint ) ;             return output ;      }   }

代码中其实就是简单的继承了Imageview 组件，同时再ImageView自身在ui上画图的时候，在OnDraw方法中用Canvas绘画一个位图，并去掉锯齿，并画一个圆形图层，用PorterDuffXfermode 合并图像。
在正常的情况下，在已有的图像上绘图将会在其上面添加一层新的形状。如果新的Paint是完全不透明的，那么它将完全遮挡住下面的Paint；如果它是部分透明的，那么它将会被染上下面的颜色。
下面的Xfermode子类可以改变这种行为：
AvoidXfermode 指定了一个颜色和容差，强制Paint避免在它上面绘图(或者只在它上面绘图)。
PixelXorXfermode 当覆盖已有的颜色时，应用一个简单的像素XOR操作。
PorterDuffXfermode 这是一个非常强大的转换模式，使用它，可以使用图像合成的16条Porter-Duff规则的任意一条来控制Paint如何与已有的Canvas图像进行交互。

关于CycleImageView的使用就像是用普通的ImageView是用一样！