Android自定义View实现QQ音乐中圆形旋转碟子
短信预约 -IT技能 免费直播动态提醒
QQ音乐中圆形旋转碟子
思路分析：
1、在onMeasure中测量整个View的宽和高后，设置宽高
2、获取我们res的图片资源后，在ondraw方法中进行绘制圆形图片
3、通过Handler发送Runnable来启动旋转线程（如果只想做圆形头像的话，这步可以去掉）
4、在布局中使用我们的View
效果图：
贴出我们的变量信息：
//view的宽和高
int mHeight = 0;
int mWidth = 0;
//圆形图片
Bitmap bitmap = null;
//圆形图片的真实半径
int radius = 0;
//旋转动画的矩形
Matrix matrix = new Matrix();
//旋转动画的角度
int degrees = 0;
步骤一：测量整个View的宽和高后，设置宽高
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//测量整个View的宽和高
mWidth = measuredWidth(widthMeasureSpec);
mHeight= measuredHeight(heightMeasureSpec);
setMeasuredDimension(mWidth, mHeight);
}
private int measuredWidth(int widthMeasureSpec) {
int Mode = MeasureSpec.getMode(widthMeasureSpec);
int Size = MeasureSpec.getSize(widthMeasureSpec);
if (Mode == MeasureSpec.EXACTLY) {
mWidth = Size;
} else {
//由图片决定宽度
int value = getPaddingLeft() + getPaddingRight() + bitmap.getWidth();
if (Mode == MeasureSpec.AT_MOST) {
//由图片和Padding决定宽度，但是不能超过View的宽
mWidth = Math.min(value, Size);
}
}
return mWidth;
}
private int measuredHeight(int heightMeasureSpec) {
int Mode = MeasureSpec.getMode(heightMeasureSpec);
int Size = MeasureSpec.getSize(heightMeasureSpec);
if (Mode == MeasureSpec.EXACTLY) {
mHeight = Size;
} else {
//由图片决定高度
int value = getPaddingTop() + getPaddingBottom() + bitmap.getHeight();
if (Mode == MeasureSpec.AT_MOST) {
//由图片和Padding决定高度，但是不能超过View的高
mHeight = Math.min(value, Size);
}
}
return mHeight;
} 步骤二：获取我们res的图片资源后，在ondraw方法中进行绘制圆形图片
//获取res的图片资源
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.concat(matrix);
//真实的半径必须是View的宽高最小值
radius = Math.min(mWidth, mHeight);
//如果图片本身宽高太大，进行相应的缩放
bitmap = Bitmap.createScaledBitmap(bitmap, radius, radius, false);
//画圆形图片
canvas.drawBitmap(createCircleImage(bitmap, radius), 0, 0, null);
matrix.reset();
}
private Bitmap createCircleImage(Bitmap source, int radius) {
Paint paint = new Paint();
paint.setAntiAlias(true);
Bitmap target = Bitmap.createBitmap(radius, radius, Bitmap.Config.ARGB_8888);
//产生一个同样大小的画布
Canvas canvas = new Canvas(target);
//首先绘制圆形
canvas.drawCircle(radius / 2, radius / 2, radius / 2, paint);
//使用class="lazy" data-src_IN模式显示后画图的交集处
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.class="lazy" data-src_IN));
//绘制图片，从（0，0）画
canvas.drawBitmap(source, 0, 0, paint);
return target;
}
步骤三：通过Handler发送Runnable来启动旋转线程
//开始旋转
mHandler.post(runnable);
[java] view plain copy 在CODE上查看代码片派生到我的代码片
//-----------旋转动画-----------
Handler mHandler = new Handler();
Runnable runnable = new Runnable() {
@Override
public void run() {
matrix.postRotate(degrees++, radius / 2, radius / 2);
//重绘
invalidate();
mHandler.postDelayed(runnable, 50);
}
};
步骤四：在布局中使用我们的View
<com.handsome.cycle.MyCycleView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
下面是整个类的源码
public class MyCycleView extends View {
//view的宽和高
int mHeight = 0;
int mWidth = 0;
//圆形图片
Bitmap bitmap = null;
//圆形图片的真实半径
int radius = 0;
//旋转动画的矩形
Matrix matrix = new Matrix();
//旋转动画的角度
int degrees = 0;
//-----------旋转动画-----------
Handler mHandler = new Handler();
Runnable runnable = new Runnable() {
@Override
public void run() {
matrix.postRotate(degrees++, radius / 2, radius / 2);
//重绘
invalidate();
mHandler.postDelayed(runnable, 50);
}
};
public MyCycleView(Context context) {
super(context);
initView();
}
public MyCycleView(Context context, AttributeSet attrs) {
super(context, attrs);
initView();
}
public MyCycleView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
initView();
}
public void initView() {
//获取res的图片资源
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.icon);
//开始旋转
mHandler.post(runnable);
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//测量整个View的宽和高
mWidth = measuredWidth(widthMeasureSpec);
mHeight = measuredHeight(heightMeasureSpec);
setMeasuredDimension(mWidth, mHeight);
}
private int measuredWidth(int widthMeasureSpec) {
int Mode = MeasureSpec.getMode(widthMeasureSpec);
int Size = MeasureSpec.getSize(widthMeasureSpec);
if (Mode == MeasureSpec.EXACTLY) {
mWidth = Size;
} else {
//由图片决定宽度
int value = getPaddingLeft() + getPaddingRight() + bitmap.getWidth();
if (Mode == MeasureSpec.AT_MOST) {
//由图片和Padding决定宽度，但是不能超过View的宽
mWidth = Math.min(value, Size);
}
}
return mWidth;
}
private int measuredHeight(int heightMeasureSpec) {
int Mode = MeasureSpec.getMode(heightMeasureSpec);
int Size = MeasureSpec.getSize(heightMeasureSpec);
if (Mode == MeasureSpec.EXACTLY) {
mHeight = Size;
} else {
//由图片决定高度
int value = getPaddingTop() + getPaddingBottom() + bitmap.getHeight();
if (Mode == MeasureSpec.AT_MOST) {
//由图片和Padding决定高度，但是不能超过View的高
mHeight = Math.min(value, Size);
}
}
return mHeight;
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.concat(matrix);
//真实的半径必须是View的宽高最小值
radius = Math.min(mWidth, mHeight);
//如果图片本身宽高太大，进行相应的缩放
bitmap = Bitmap.createScaledBitmap(bitmap, radius, radius, false);
//画圆形图片
canvas.drawBitmap(createCircleImage(bitmap, radius), 0, 0, null);
matrix.reset();
}
private Bitmap createCircleImage(Bitmap source, int radius) {
Paint paint = new Paint();
paint.setAntiAlias(true);
Bitmap target = Bitmap.createBitmap(radius, radius, Bitmap.Config.ARGB_8888);
//产生一个同样大小的画布
Canvas canvas = new Canvas(target);
//首先绘制圆形
canvas.drawCircle(radius / 2, radius / 2, radius / 2, paint);
//使用class="lazy" data-src_IN模式显示后画图的交集处
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.class="lazy" data-src_IN));
//绘制图片，从（0，0）画
canvas.drawBitmap(source, 0, 0, paint);
return target;
}
}
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
