Android UI开发第四十二篇——实现实现易信的圆形图像和对话列表的图像显示部分
显示图像时,很多个性化显示,圆形或圆角、气泡等等,我们这一篇文章探讨一下圆形和气泡的显示,仿照易信中的实现,先看下效果图:
代码:
public class RoundImageView extends ImageView { public RoundImageView(Context context) {
super(context);
// TODO Auto-generated constructor stub
} public RoundImageView(Context context, AttributeSet attrs) {
super(context, attrs); } public RoundImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle); } @Override
protected void onDraw(Canvas canvas) { Drawable drawable = getDrawable(); if (drawable == null) {
return;
} if (getWidth() == 0 || getHeight() == 0) {
return;
} Bitmap bitmapBorder =BitmapFactory.decodeResource(getResources(), R.drawable.border);
Bitmap bitmapMask =BitmapFactory.decodeResource(getResources(), R.drawable.mask); int _width = bitmapBorder.getWidth();
int _height = bitmapBorder.getHeight(); Paint paint = new Paint();
PorterDuffXfermode xfermode = new PorterDuffXfermode(PorterDuff.Mode.SRC_IN); Bitmap bitmap = ((BitmapDrawable)drawable).getBitmap() ;
canvas.drawBitmap(bitmapBorder, 0, 0, paint);
int saveFlags = Canvas.MATRIX_SAVE_FLAG | Canvas.CLIP_SAVE_FLAG | Canvas.HAS_ALPHA_LAYER_SAVE_FLAG | Canvas.FULL_COLOR_LAYER_SAVE_FLAG | Canvas.CLIP_TO_LAYER_SAVE_FLAG;
canvas.saveLayer(0, 0, _width, _height, null, saveFlags);
canvas.drawBitmap(bitmapMask, 0, 0, paint);
paint.setXfermode(xfermode);
int left = _width/2 - bitmap.getWidth() /2;
int top = _height/2 - bitmap.getHeight()/2;
canvas.drawBitmap(bitmap, left, top, paint);
paint.setXfermode(null);
canvas.restore(); } }
上述效果使用了“遮罩”的方式实现,使用了Paint的Xfermode。我们介绍下setXfermode方法,setXfermode方法用来设置两张图片相交时的模式。
PorterDuff.Mode.CLEAR 清除画布上图像
PorterDuff.Mode.SRC 显示上层图像
PorterDuff.Mode.DST 显示下层图像
PorterDuff.Mode.SRC_OVER上下层图像都显示,上层居上显示
PorterDuff.Mode.DST_OVER 上下层都显示,下层居上显示
PorterDuff.Mode.SRC_IN 取两层图像交集部门,只显示上层图像
PorterDuff.Mode.DST_IN 取两层图像交集部门,只显示下层图像
PorterDuff.Mode.SRC_OUT 取上层图像非交集部门
PorterDuff.Mode.DST_OUT 取下层图像非交集部门
PorterDuff.Mode.SRC_ATOP 取下层图像非交集部门与上层图像交集部门
PorterDuff.Mode.DST_ATOP 取上层图像非交集部门与下层图像交集部门
PorterDuff.Mode.XOR 取两层图像的非交集部门
RoundImageView使用了自定义View实现,重点重写了onDraw方法,使用了paint、canvas,这两个自定义View必须掌握的两个基础工具,这里就不多写了,提供几个参考:
Android 2D Graphics学习(一)、android.graphics介绍
Android--Matrix图片变换处理
Paint的效果研究
最新文章
- c++的性能, c#的产能?!鱼和熊掌可以兼得,.NET NATIVE初窥
- Spring中javaMail通过SMTP发送邮件
- ASP.NET ZERO Core Application 学习笔记
- Kali Linux Web 渗透测试— 第十二课-websploit
- jQuery实现轮播图效果
- 如何取消FLEX里模态窗口的毛玻璃效果
- 利用VS自带的命令行工具查看和生产PublicKeyToken (转)
- 项目需要简单些了个WEB APP 的弹出窗
- OCP读书笔记(19) - 数据库空间管理
- pb9常见错误及含义
- TeamCity Agent安装
- 写入一个html文件时的编码要求
- 解决js数组循环删除出错
- 【kindle笔记】之 《恶意》-2018-4-20
- 批处理最完整人性化教程(.bat文件语法)
- poj1029 False coin
- 《Linux内核设计与实现》Chapter 18 读书笔记
- 重学Verilog(3)——参数化模块
- mongoose 操作一直转圈
- JavaScript设计模式-6.封装