效果图
页面代码
public class SouthView extends View {
private Paint mPaint;
private int mRadius;
private int mCirclrRadius;
private float mDegrees=0;
public SouthView(Context context) {
super(context);
}
public SouthView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SouthView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onDraw(final Canvas canvas) {
super.onDraw(canvas);
int width = canvas.getWidth();
mRadius = width / 2;
mCirclrRadius = mRadius - 15;
canvas.translate(width / 2, width / 2);//移动画布原点
mPaint = new Paint();
mPaint.setColor(getResources().getColor(R.color.bg_black));//设置画笔颜色
mPaint.setStyle(Paint.Style.FILL);//设置实心
mPaint.setAntiAlias(true);//抗锯齿
canvas.drawCircle(0, 0, mRadius, mPaint);//以原点为圆心画圆
mPaint.setColor(Color.WHITE);
mPaint.setStrokeWidth(5);
mPaint.setStyle(Paint.Style.STROKE);
RectF rectF = new RectF(-mCirclrRadius, -mCirclrRadius, mCirclrRadius, mCirclrRadius);
for (int i = 0; i < 4; i++) {
canvas.drawArc(rectF, 10, 70, false, mPaint);
canvas.rotate(90);
}
Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_south);
Matrix matrix = new Matrix();
float f = (float) width / bitmap.getWidth();
matrix.postScale(f, f);//缩小至相应比例
Bitmap dstbmp = Bitmap.createBitmap(bitmap, 0, 0, bitmap.getWidth(), bitmap.getHeight(), matrix, true);
canvas.rotate(mDegrees++);
canvas.drawBitmap(dstbmp, -bitmap.getWidth() * f / 2, -bitmap.getWidth() * f / 2, mPaint);
canvas.rotate(-mDegrees*5);
}
public void rotateBmp(){
while (true){
postInvalidate();//子线程更新UI
}
}
}
使用方法
southView=(SouthView)view.findViewById(R.id.view_south);
new Thread(new Runnable() {
@Override
public void run() {
southView.rotateBmp();
}
}).start();
如果你喜欢我的风格,还可以看下这篇文章canvas和paint画劳力士表盘