[置顶] Android自定义View——时钟
android,时钟,自定义View,canvas,view2016-11-04
//将之前所绘制的图形保存起来,然后后续的操作就好像在一个新的图层上操作一样,与ps的图层基本一致
canvas.save();
//将画布绕着(x,y)坐标点顺时针旋转angle°。angle为负数则逆时针旋转
canvas.rotate(angle, x, y);
//可以理解为PhotoShop中的合并图层操作,将save之前的图像与save之后的合并
canvas.restore();
//外圆画笔
private Paint paint;
//文字画笔
private Paint paintNum;
//时钟画笔
private Paint paintHour;
//分钟画笔
private Paint paintMinute;
//秒钟画笔
private Paint paintSecond;
//外圆圆心
private float x, y;
//外圆半径
private int r;
//时间刻度
private String[] num = {"12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"};
onMeasure
函数来得到我们view所在布局中的大小@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int height = getMeasuredHeight();
int width = getMeasuredWidth();
x = width / 2;
y = height / 2;
//圆的半径即为view宽度的一半,在减5会使得边缘好看些
r = (int) x - 5;
}
onDraw
函数来进行绘制了//绘制外圆
canvas.drawCircle(x, y, r, paint);
//绘制圆心
canvas.drawCircle(x, y, 15, paintMinute);
/**
* 绘制时钟刻度和分钟刻度
*
* @param canvas 画布
*/
private void drawLines(Canvas canvas) {
for (int i = 0; i < 60; i++) {
if (i % 5 == 0) {
//绘制整点刻度
paint.setStrokeWidth(8);
canvas.drawLine(x, y - r, x, y - r + 40, paint);
//绘制数字
//paintNum.measureText(num)测量文字所占的大小
canvas.drawText(num[i / 5], x - paintNum.measureText(num[i / 5]) / 2, y - r + 70, paintNum);
} else {
//绘制分钟刻度
paint.setStrokeWidth(3);
canvas.drawLine(x, y - r, x, y - r + 30, paint);
}
//绕着(x,y)旋转6°
canvas.rotate(6, x, y);
}
}
/**
* 获取当前系统时间
*
* @param canvas 画布
*/
private void initCurrentTime(Canvas canvas) {
//获取系统当前时间
SimpleDateFormat format = new SimpleDateFormat("HH-mm-ss");
String time = format.format(new Date(System.currentTimeMillis()));
String[] split = time.split("-");
int hour = Integer.parseInt(split[0]);
int minute = Integer.parseInt(split[1]);
int second = Integer.parseInt(split[2]);
//时针走过的角度
int hourAngle = hour * 30 + minute / 2;
//分针走过的角度
int minuteAngle = minute * 6;
//秒针走过的角度
int secondAngle = second * 6;
//绘制时钟,以12整点为0°参照点
canvas.rotate(hourAngle, x, y);
canvas.drawLine(x, y, x, y - r + 150, paintHour);
canvas.save();
canvas.restore();
//这里画好了时钟,我们需要再将画布转回来,继续以12整点为0°参照点
canvas.rotate(-hourAngle, x, y);
//绘制分钟
canvas.rotate(minuteAngle, x, y);
canvas.drawLine(x, y, x, y - r + 60, paintMinute);
canvas.save();
canvas.restore();
//这里同上
canvas.rotate(-minuteAngle, x, y);
//绘制秒钟
canvas.rotate(secondAngle, x, y);
canvas.drawLine(x, y, x, y - r + 20, paintSecond);
}
onDraw函数中
每隔1s刷新界面,这样时钟效果也就出来了postInvalidateDelayed(1000);