自定义圆形图片

时间：2015-10-28 22:48:23 阅读：268 评论：0 收藏：0 [点我收藏+]

标签：

圆形图片相必是项目开发中也是不少用的一个知识点吧。

那么这里学习一下简单的制作圆形图片，主要运用 BitmapShader 类的知识来实现

一、首先，了解一下 BitmapShader 类

BitmapShader是Shader的子类，可以通过Paint.setShader（Shader shader）进行设置

看一下BitmapShader 的构造方法

BitmapShader bitmapShader = new BitmapShader(bitmap,TileMode, TileMode);

调用这个方法来产生一个画有一个位图的渲染器（Shader）

看参数

bitmap 即在渲染器内的位图

TileMode ，分为三类

1、CLAMP ：如果渲染器超出原始边界范围，会复制范围内边缘染色，即拉伸

2、REPEAT ：横向和纵向的重复渲染器图片，平铺，即重复

3、MIRROR ：横向和纵向的重复渲染器图片，这个和REPEAT重复方式不一样，他是以镜像方式平铺，类似于湖上的物体和湖中的倒影

使用这个类的目的，就是把它的对象设置给Paint ，而Paint会根据TileMode进行绘制位图

二、实现圆形图片步骤

首先，ImageView和ImageButton需要图片，

有两种生成圆形图片的方法

1、自定义View继承ImageView、ImageButton

2、imageView.setXXX();

看下ImageView的设置图片方法：

1 ImageView imageView = new ImageView(this);
2 
3 imageView.setImageDrawable();  // 参数为一个Drawable 对象
4 imageView.setImageResource();  // 参数为一个资源文件
5 imageView.setImageBitmap();    // 参数为一个Bitmap 对象

那么我们这里实现方法为自定义继承Drawable类，运用 imageView.setImageDrawable(); 设置圆形图片

实现步骤：

1、新建一个类继承Drawable

添加成员变量

private Paint paint;     //自定义必备画笔类
private Bitmap bitmap;   //将Bitmap 转为Drawable ,
private int width;       // 圆形图片的宽度
private int height;      // 圆形图片的高度
private int radiu;       // 圆形图片的半径

2、重写构造方法

 1 public CircleImageView(Bitmap bitmap) {
 2         this.bitmap = bitmap;
 3         BitmapShader bitmapShader =
 4                 new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
 5 
 6         paint = new Paint();
 7         //抗锯齿 ，使得边缘光滑
 8         paint.setAntiAlias(true);
 9         //得到bitmap位图的宽高
10         width = bitmap.getWidth();
11         height = bitmap.getHeight();
12        //获取bitmap位图的宽高中的最小值，作为圆形图片的半径
13         radiu =Math.min(bitmap.getWidth(), bitmap.getHeight())/2;
14 
15         // 设置shader
16         paint.setShader(bitmapShader);
17     }

3、重写其他必要方法

@Override
    public void draw(Canvas canvas) {
        // 以bitmap中心点为圆心，长宽最小边为半径画圆，将Bitmap填充到圆中
        canvas.drawCircle(width/2,height/2,radiu,paint);
    }

    //设置透明度
    @Override
    public void setAlpha(int i) {
        paint.setAlpha(i);
    }

    //设置颜色
    @Override
    public void setColorFilter(ColorFilter colorFilter) {
        paint.setColorFilter(colorFilter);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }


    @Override
    public int getIntrinsicHeight() {
        return width;
    }

    @Override
    public int getIntrinsicWidth() {
        return width;
    }

完整代码：

 1 package com.xqx.CircleImageView;
 2 
 3 import android.graphics.*;
 4 import android.graphics.drawable.Drawable;
 5 
 6 
 7 public class CircleImageView extends Drawable {
 8 
 9     private Paint paint;
10     private Bitmap bitmap;
11     private int width;
12     private int height;
13     private int radiu;
14 
15     public CircleImageView(Bitmap bitmap) {
16         this.bitmap = bitmap;
17         BitmapShader bitmapShader =
18                 new BitmapShader(bitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);
19 
20         paint = new Paint();
21         //抗锯齿 ，使得边缘光滑
22         paint.setAntiAlias(true);
23         //获取bitmap位图的宽高中的最小值，作为圆形图片的
24         width = bitmap.getWidth();
25         height = bitmap.getHeight();
26         radiu =Math.min(bitmap.getWidth(), bitmap.getHeight())/2;
27 
28         // 设置shader
29         paint.setShader(bitmapShader);
30     }
31 
32     @Override
33     public void draw(Canvas canvas) {
34         // 以bitmap中心点为圆心，长宽最小边为半径画圆，将Bitmap填充到圆中
35         canvas.drawCircle(width/2,height/2,radiu,paint);
36     }
37 
38     //设置透明度
39     @Override
40     public void setAlpha(int i) {
41         paint.setAlpha(i);
42     }
43 
44     //设置颜色
45     @Override
46     public void setColorFilter(ColorFilter colorFilter) {
47         paint.setColorFilter(colorFilter);
48     }
49 
50     @Override
51     public int getOpacity() {
52         return PixelFormat.TRANSLUCENT;
53     }
54 
55 
56     @Override
57     public int getIntrinsicHeight() {
58         return width;
59     }
60 
61     @Override
62     public int getIntrinsicWidth() {
63         return width;
64     }
65 }

CircleImageView

4、运用

 1 package com.xqx.CircleImageView;
 2 
 3 import android.app.Activity;
 4 import android.graphics.*;
 5 import android.os.Bundle;
 6 import android.widget.ImageView;
 7 
 8 public class MainActivity extends Activity {
 9     private ImageView imageView;
10     @Override
11     public void onCreate(Bundle savedInstanceState) {
12         super.onCreate(savedInstanceState);
13         setContentView(R.layout.main);
14         imageView = (ImageView) findViewById(R.id.img);
15         Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.icon);
16         imageView.setImageDrawable(new CircleImageView(bitmap));
17     }
18 }