下图是最终要达到的效果:
大概的思路:我们需要一张做好的.9图片:
第一步先实先没有边框的效果:
Bitmap bitmap_in = BitmapFactory.decodeResource(getResources(), R.drawable.pic );//原图
Bitmap bitmap_bg = BitmapFactory.decodeResource(getResources(), R.drawable.chat_adapter_to_bg );//.9图片
public Bitmap getRoundCornerImage(Bitmap bitmap_bg , Bitmap bitmap_in) {
// 创建一个空的bitmap对象
Bitmap roundConcerImage = Bitmap.createBitmap(300, 300, Config. ARGB_8888);
// 把空的bitmap对象装入Canvas中
Canvas canvas = new Canvas(roundConcerImage );
// 创建一个画笔
Paint paint = new Paint();
// 绘制矩形区域(左上角的坐标是0.0右下角的坐标是500.500)
Rect rect = new Rect(0, 0, 300, 300);
// 左上角的坐标是(0,0),右下角的坐标是(图片的宽,图片的高)
Rect rectF = new Rect(0, 0, bitmap_in.getWidth(), bitmap_in .getHeight());
// canvas绘制位图的时候会出现锯齿,设置该参数是抗锯齿的作用
// paint.setAntiAlias(true);
// 创建.9可拉伸背景图
NinePatch patch = new NinePatch(bitmap_bg , bitmap_bg.getNinePatchChunk(), null);
// 把指定区域的位置,画上.9背景图
patch.draw( canvas, rect);
// 设置两张图片相交时的模式,Mode.SRC_IN模式就是当rectF与 rect相交的时候只显示他们相交的部分,且 rectf覆盖rect
paint.setXfermode( new PorterDuffXfermode(Mode.SRC_IN ));//实现效果最重要的一行代码
canvas.drawBitmap( bitmap_in, rectF , rect , paint);
return roundConcerImage ;
}
这时图片效果如下:
接下来就是把绿色的边框加上:
public Bitmap getShardImage(Bitmap bitmap_bg , Bitmap bitmap_in) {
//创建一个空的bitmap对象
Bitmap roundConcerImage = Bitmap.createBitmap(300, 300, Config. ARGB_8888);
//把空的bitmap对象装入canvas中
Canvas canvas = new Canvas(roundConcerImage );
//创建一个画笔
Paint paint = new Paint();
//创建一个大小为300*300的矩形
Rect rect = new Rect(0, 0, 300, 300);
//消除锯齿
paint.setAntiAlias( true);
//往画布上画上.9背景图
NinePatch patch = new NinePatch(bitmap_bg , bitmap_bg.getNinePatchChunk(), null);
patch.draw( canvas, rect);
//再创建一个宽高都比上一个 rect小2的rect
Rect rect2 = new Rect(2, 2, 298, 298);
//这个就不要设置相交的模式了,因为 rect比rect2小,绿色部分正好会露出来
canvas.drawBitmap( bitmap_in, rect , rect2 , paint);
return roundConcerImage ;
}
最后效果就如第一张图片。它实现的原理实际上是切除图片三角部分那一列的图片,只保留了一个三角图片。