欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android自定义View实现QQ音乐中圆形旋转碟子

程序员文章站 2024-03-05 17:36:01
qq音乐中圆形旋转碟子 思路分析: 1、在onmeasure中测量整个view的宽和高后,设置宽高 2、获取我们res的图片资源后,在ondraw方法中进行绘制圆形图...

qq音乐中圆形旋转碟子

思路分析:
1、在onmeasure中测量整个view的宽和高后,设置宽高
2、获取我们res的图片资源后,在ondraw方法中进行绘制圆形图片
3、通过handler发送runnable来启动旋转线程(如果只想做圆形头像的话,这步可以去掉)
4、在布局中使用我们的view

效果图:

Android自定义View实现QQ音乐中圆形旋转碟子

贴出我们的变量信息:

//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); 
 //使用src_in模式显示后画图的交集处 
 paint.setxfermode(new porterduffxfermode(porterduff.mode.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); 
  //使用src_in模式显示后画图的交集处 
  paint.setxfermode(new porterduffxfermode(porterduff.mode.src_in)); 
  //绘制图片,从(0,0)画 
  canvas.drawbitmap(source, 0, 0, paint); 
  return target; 
 } 
} 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。