自定义控件--时钟自定义控件--时钟

【自定义控件--时钟】
先上效果图
文章图片
效果图先继承View,然后再写构造方法,构造方法里初始化画笔

public ClockView(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); bigCiclePaint = new Paint(); bigCiclePaint.setColor(Color.BLUE); bigCiclePaint.setStyle(Paint.Style.STROKE); bigCiclePaint.setStrokeWidth(34); smallCiclePaint = new Paint(); smallCiclePaint.setColor(Color.RED); smallCiclePaint.setStyle(Paint.Style.FILL); calibrationPaint = new Paint(); calibrationPaint.setColor(Color.BLUE); calibrationPaint.setStyle(Paint.Style.FILL); calibrationPaint.setStrokeWidth(20); numPaint = new Paint(); numPaint.setColor(Color.RED); numPaint.setAntiAlias(true); numPaint.setTextAlign(Paint.Align.CENTER); numPaint.setTextSize(40); hourPaint = new Paint(); hourPaint.setColor(Color.parseColor("#3F51B5")); hourPaint.setStrokeWidth(25); minutePaint = new Paint(); minutePaint.setColor(Color.DKGRAY); minutePaint.setStrokeWidth(18); secondPaint = new Paint(); secondPaint.setColor(Color.parseColor("#FF4081")); secondPaint.setStrokeWidth(11); }

解释：

bigCiclePaint：画大表盘的画笔
smallCiclePaint:画小圆心的画笔
calibrationPaint:画12个刻度的画笔
numPaint：画刻度下的数字的画笔
hourPaint：小时的画笔
minutePaint：分钟的画笔
secondPaint：秒针的画笔

在onDraw方法里面画

@Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); calendar = Calendar.getInstance(); int clockWidth = getWidth(); cX=clockWidth/2; cY=clockWidth/2; bigRadius=(float) clockWidth/2-75; canvas.drawCircle(cX,cY,bigRadius,bigCiclePaint); //画大表盘 canvas.drawCircle(cX,cY,30,smallCiclePaint); //画小圆心//canvas.save()方法和canvas.restore()方法都是成对出现的，这一点要注意。 for (int i = 1; i <13 ; i++) { //在旋转之前保存画布状态 canvas.save(); canvas.rotate(i*30,cX,cY); //先画1点，从1到12 canvas.drawLine(cX,cY-bigRadius+34/2,cX,cY-bigRadius+34/2+18,calibrationPaint); //画刻度 //画刻度上数字,第三个参数表示文字的基准线 canvas.drawText(i+"",cX,cY-bigRadius+34/2+18+50,numPaint); //恢复画布状态 canvas.restore(); } //获得当前小时 int hour = calendar.get(Calendar.HOUR); int minute= calendar.get(Calendar.MINUTE); int second= calendar.get(Calendar.SECOND); //Log.d("alan","hour----->"+hour); //Log.d("alan","minute--->"+minute); Log.d("alan","second--->"+second); float hourDegree=((float)minute/60+hour)*30; //画时针时画布应该旋转的度数 //Log.d("alan","(float)minute/60---->"+(float)minute/60); //Log.d("alan","hourDegree--->"+hourDegree); canvas.save(); canvas.rotate(hourDegree,cX,cY); //旋转画布准备画时针 canvas.drawLine(cX,cY-200,cX,cY,hourPaint); //画时针 canvas.restore(); //重置画布//canvas.save(); float minuteDegree=((float)minute)/60*360; //画分针时画布应该旋转的度数 //Log.d("alan","minuteDegree--->"+minuteDegree); canvas.rotate(minuteDegree,cX,cY); canvas.drawLine(cX,cY-250,cX,cY,minutePaint); canvas.restore(); float secondDegree=((float)second)/60*360; //画秒针时画布应该旋转的度数 //Log.d("alan","secondDegree--->"+secondDegree); canvas.rotate(secondDegree,cX,cY); //这里是顺时针旋转 canvas.drawLine(cX,cY-300,cX,cY,secondPaint); canvas.restore(); postInvalidateDelayed(1000); //每1秒钟重绘一次 }

这样就完成了自定义控件的制作，然后在布局中引用就行了

代码已经上传到我的GitHub上，如果喜欢的话，不妨Star一下，我GitHub上别的项目也可以关注下。
代码地址
我的GitHub地址