效果圖
先繼承View,然后再寫構(gòu)造方法,構(gòu)造方法里初始化畫筆
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：畫刻度下的數(shù)字的畫筆
- 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()方法都是成對出現(xiàn)的，這一點要注意沮稚。
for (int i = 1; i <13 ; i++) {
//在旋轉(zhuǎn)之前保存畫布狀態(tà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);//畫刻度
//畫刻度上數(shù)字,第三個參數(shù)表示文字的基準線
canvas.drawText(i+"",cX,cY-bigRadius+34/2+18+50,numPaint);
//恢復(fù)畫布狀態(tài)
canvas.restore();
}
//獲得當(dāng)前小時
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;//畫時針時畫布應(yīng)該旋轉(zhuǎn)的度數(shù)
// Log.d("alan","(float)minute/60---->"+(float)minute/60);
// Log.d("alan","hourDegree--->"+hourDegree);
canvas.save();
canvas.rotate(hourDegree,cX,cY);//旋轉(zhuǎn)畫布準備畫時針
canvas.drawLine(cX,cY-200,cX,cY,hourPaint);//畫時針
canvas.restore();//重置畫布
// canvas.save();
float minuteDegree=((float)minute)/60*360;//畫分針時畫布應(yīng)該旋轉(zhuǎn)的度數(shù)
// 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;//畫秒針時畫布應(yīng)該旋轉(zhuǎn)的度數(shù)
// Log.d("alan","secondDegree--->"+secondDegree);
canvas.rotate(secondDegree,cX,cY);//這里是順時針旋轉(zhuǎn)
canvas.drawLine(cX,cY-300,cX,cY,secondPaint);
canvas.restore();
postInvalidateDelayed(1000);//每1秒鐘重繪一次
}
這樣就完成了自定義控件的制作侥蒙，然后在布局中引用就行了
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.yus.clockview.MainActivity">
<com.yus.clockview.ClockView
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
代碼已經(jīng)上傳到我的GitHub上，如果喜歡的話凛篙，不妨Star一下臭墨，我GitHub上別的項目也可以關(guān)注下。
代碼地址
我的GitHub地址
