首先我将贴出几种实现圆角边框的dmeo程序效果图：
方式一：使用shape元素填充背景，设置圆角/带弧度的角
1、首先在 \res\drawable下新建shape为根元素的资源文件：corners_bg.xml, 代码如下：
|
1
2
3
4
5
6
7
8
9
10
|
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"><!-- 设置填充颜色 为白色 --><solid android:color="#ffffff" /><!-- 设置几何图形四个角的弧度 --><corners android:radius="10dp"/><!-- 设置几何形状绘制边框 红色边框 --><stroke android:color="#cd2626"android:width="2dp"/></shape> |
2、在layout布局文件中对需要圆角的控件引用第一步的xml文件作为背景即可。 如图
3、效果显示为 demo程序效果图中的 图一 效果
方式二：使用.9<九妹>带圆角图片设为背景
如图mm_title_act_btn_normal.9.png 是一张带圆角的图片，只需引用它作为控件[这里是button]背景资源即可。显示效果为 demo程序效果图中的 图二 效果
方式三：重写控件的draw方法[这里我以继承imageview为例]：重新draw方法，绘制控件的圆角效果
1、cornersimageview.java为自定义的圆角imageview 代码如下：
|
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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
package com.ice.cornersdemo;import android.content.context;import android.graphics.bitmap;import android.graphics.bitmapshader;import android.graphics.canvas;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.util.attributeset;import android.widget.imageview;/*** 自定义带圆角的imageview* created by ice on 14-8-6.*/public class cornersimageview extends imageview{private bitmap mbitmap;private bitmapshader mbitmapshader;private final matrix mshadermatrix = new matrix();private final paint mbitmappaint = new paint();private final rectf mdrawablerect = new rectf();private float mdrawableradius;private int mbitmapwidth;private int mbitmapheight;private static final bitmap.config bitmap_config = bitmap.config.argb_8888;private static final int colordrawable_dimension = 1;public cornersimageview(context context){super(context);}public cornersimageview(context context, attributeset attrs){this(context, attrs, 0);}public cornersimageview(context context, attributeset attrs, int defstyle){super(context, attrs, defstyle);init();}private void init() {if (mbitmap == null){return;}mbitmapshader = new bitmapshader(mbitmap, shader.tilemode.clamp, shader.tilemode.clamp);// 设置抗锯齿mbitmappaint.setantialias(true);// 使用位图平铺的渲染效果mbitmappaint.setshader(mbitmapshader);mbitmapwidth = mbitmap.getwidth();mbitmapheight = mbitmap.getheight();mdrawablerect.set(0, 0, mbitmapwidth, mbitmapheight);// 获取图片展示的圆形半径mdrawableradius = math.min(mdrawablerect.width()/2, mdrawablerect.height()/2);invalidate();}@overridepublic void draw(canvas canvas){if (getdrawable() == null){return;}canvas.drawcircle(getwidth()/2, getheight()/2, mdrawableradius, mbitmappaint);}@overridepublic void setimagebitmap(bitmap bm) {super.setimagebitmap(bm);mbitmap = bm;init();}@overridepublic void setimagedrawable(drawable drawable) {super.setimagedrawable(drawable);mbitmap = getbitmapfromdrawable(drawable);init();}@overridepublic void setimageresource(int resid) {super.setimageresource(resid);mbitmap = getbitmapfromdrawable(getdrawable());init();}/*** 将drawable转换成bitmap对象* @param drawable* @return*/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;}}} |
2、在布局文件中使用自定义控件cornersimageview 如下图：
3、显示效果为 demo程序效果图中的 图三 效果
其他：其实对于实现图片圆形显示前面介绍的重写imageview的draw方法是在控件本身上做处理，还有一种更简单的方式就是在要显示的图片身上做处理,及对图片本身进行圆形剪切，剪切后显示在控件imageview上。
图片圆形剪切的方法如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
/*** 将方形图片剪切成圆图* @param bitmap* @return*/public static bitmap getcirclebitmap(bitmap bitmap) {bitmap output = bitmap.createbitmap(bitmap.getwidth(), bitmap.getheight(), config.argb_8888);canvas canvas = new canvas(output);rect rect = new rect(0, 0, bitmap.getwidth(), bitmap.getheight());rectf rectf = new rectf(rect);paint paint = new paint();paint.setantialias(true); // 防止边缘的锯齿paint.setfilterbitmap(true); // 对位图进行滤波处理canvas.drawoval(rectf, paint); // 根据rectf 绘制一个椭圆/圆形// 设置两张图片相交时的显示模式为 src_inpaint.setxfermode(new porterduffxfermode(mode.src_in));canvas.drawbitmap(bitmap, rect, rectf, paint);return output;} |
在代码上 我们只要获取到待显示图片的bitmap对象，然后调用上面的方法
getcirclebitmap(bitmap bitmap) 进行圆形剪切后得到新的bitmap对象，然后调用imageview的方法 setimagebitma(bitmapbitmap) 显示在控件上。显示效果为 demo程序效果图中的 图四 效果
[和图三效果一样] 。
