Android自定义View圆形图片控件代码详解
作者:milovetingting 时间:2022-05-15 12:00:53
前言
在日常开发中,圆形的图片效果还是很常见的。可以通过给Paint设置Xfermode来实现,这里简单记录如下。
实现
实现圆形效果的核心是PorterDuffXfermode,对于PorterDuffXfermode,这里不展开,可以查询相关资料。
核心代码
//绘制背景
canvas.drawCircle(mSize / 2, mSize / 2, mSize / 2, mPaint);
//设置模式为:显示背景层和上层的交集,且显示上层图像
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
//绘制要显示的图像
canvas.drawBitmap(mSrcBitmap, 0, 0, mPaint);
//重置Xfermode
mPaint.setXfermode(null);
自定义属性
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="CircleView">
<!--定义资源-->
<attr name="src" format="reference" />
<!--定义类型-->
<attr name="type" format="enum">
<!--圆形-->
<enum name="round" value="1" />
<!--矩形-->
<enum name="rect" value="2" />
</attr>
</declare-styleable>
</resources>
自定义控件
public class CircleView extends View {
private static final int DEFAULT_SIZE = 200;
private static final int DEFAULT_RADIUS = 20;
private static final int TYPE_ROUND = 1;
private static final int TYPE_RECT = 2;
private int mSize;
private int mResourceId;
private int mType;
private Paint mPaint;
private Bitmap mSrcBitmap;
public CircleView(Context context) {
this(context, null);
}
public CircleView(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public CircleView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.CircleView);
mResourceId = ta.getResourceId(R.styleable.CircleView_src, R.mipmap.ic_launcher);
mType = ta.getInt(R.styleable.CircleView_type, TYPE_ROUND);
ta.recycle();
init();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int width = getMeasureSize(widthMeasureSpec);
int height = getMeasureSize(heightMeasureSpec);
mSize = Math.min(width, height);
setMeasuredDimension(mSize, mSize);
}
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//绘制背景
if (mSrcBitmap == null) {
mSrcBitmap = getScaleBitmap();
}
if (mType == TYPE_ROUND) {
canvas.drawCircle(mSize / 2, mSize / 2, mSize / 2, mPaint);
} else if (mType == TYPE_RECT) {
canvas.drawRoundRect(0, 0, mSize, mSize, DEFAULT_RADIUS, DEFAULT_RADIUS, mPaint);
}
//设置模式为:显示背景层和上层的交集,且显示上层图像
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
//绘制要显示的图像
canvas.drawBitmap(mSrcBitmap, 0, 0, mPaint);
//重置Xfermode
mPaint.setXfermode(null);
}
private void init() {
//禁用硬件加速,否则可能无法绘制圆形
setLayerType(LAYER_TYPE_HARDWARE, null);
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setStyle(Paint.Style.FILL);
}
private int getMeasureSize(int measureSpec) {
int mode = MeasureSpec.getMode(measureSpec);
int size = MeasureSpec.getSize(measureSpec);
return mode == MeasureSpec.EXACTLY ? size : DEFAULT_SIZE;
}
/**
* 获取缩放后的Bitmap
*
* @return
*/
private Bitmap getScaleBitmap() {
BitmapFactory.Options options = new BitmapFactory.Options();
options.inJustDecodeBounds = true;
BitmapFactory.decodeResource(getResources(), mResourceId, options);
options.inSampleSize = calcSampleSize(options, mSize, mSize);
options.inJustDecodeBounds = false;
return BitmapFactory.decodeResource(getResources(), mResourceId, options);
}
/**
* 计算缩放比例
*
* @param option
* @param width
* @param height
* @return
*/
private int calcSampleSize(BitmapFactory.Options option, int width, int height) {
int originWidth = option.outWidth;
int originHeight = option.outHeight;
int sampleSize = 1;
while ((originWidth = originWidth >> 1) > width && (originHeight = originHeight >> 1) > height) {
sampleSize = sampleSize << 1;
}
return sampleSize;
}
}
注意:如果没有圆形的效果,那么可能需要禁用硬件加速:setLayerType(LAYER_TYPE_HARDWARE, null)
布局
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="vertical"
tools:context=".MainActivity">
<com.wangyz.custom.CircleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="10dp"
app:src="@drawable/image" />
<com.wangyz.custom.CircleView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp"
app:src="@drawable/image" />
<com.wangyz.custom.CircleView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp"
app:src="@drawable/image"
app:type="rect" />
</LinearLayout>
效果
来源:https://www.cnblogs.com/milovetingting/p/13071429.html
标签:Android,自定义,View
0
投稿
猜你喜欢
Java 如何实现解压缩文件和文件夹
2023-07-17 23:10:22
C#算法之整数反转
2021-09-24 18:36:49
Java语言中的文件数据流示例详解
2023-05-12 19:55:29
Java重写equals及hashcode方法流程解析
2023-10-14 06:53:13
Josephus环的四种解法(约瑟夫环)基于java详解
2022-02-28 23:29:13
springcloud feign传输List的坑及解决
2023-06-20 18:31:57
Java类锁、对象锁、私有锁冲突测试
2022-04-25 05:06:22
Java基于递归和循环两种方式实现未知维度集合的笛卡尔积算法示例
2021-07-19 04:41:18
java实现ArrayList根据存储对象排序功能示例
2022-01-24 01:06:05
C# 如何设置label(标签)控件的背景颜色为透明
2023-05-27 11:03:00
RocketMQ实现随缘分BUG小功能示例详解
2023-01-20 04:21:05
Java中的interrupted()和isInterrupted()
2023-06-17 22:16:31
Android iOS常用APP崩溃日志获取命令方法
2022-06-15 08:07:14
从java中调用matlab详细介绍
2023-08-01 14:04:17
SpringBoot项目的配置文件中设置server.port不生效问题
2022-11-13 06:01:26
简单了解springboot的jar包部署步骤
2021-07-02 14:22:48
Spring Security 中细化权限粒度的方法
2022-08-30 14:26:40
java Mail邮件接收工具类
2022-04-24 14:17:17
Maven配置文件pom.xml详解
2022-07-03 02:26:43
详解Java8新特性Stream之list转map及问题解决
2021-06-12 05:45:06