思路:
1.定义一个类继承于view,并重写里面的3个方法并作出修改(如下面紫色部分做修改);加粗部分为重写的3个方法;
2.在onDraw方法里画出内容;
注意:
//画字符时,它会从右下角开始画起:
代码:
public class ClockView extends View {
private int radius;
//中心点x,y
private float cx;
private float cy;
public ClockView(Context context) {
this(context,null);
}
public ClockView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public ClockView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
radius = Math.min(getWidth(), getHeight()) / 2-10; //半径之所以减去10,是为了好看一些,不然就会和边框相切
cx=getWidth()/2;
cy=getHeight()/2;
Paint paint=new Paint();
paint.setColor(Color.RED);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(6);
paint.setAntiAlias(true);
canvas.drawCircle(cx,cy,radius,paint);
//拿到当前时间
int hour = Calendar.getInstance().get(Calendar.HOUR); //注意,Calendar的包不要导错了
int minute = Calendar.getInstance().get(Calendar.MINUTE);
int second = Calendar.getInstance().get(Calendar.SECOND);
float fHour=hour+minute/60f; //得到精确的小时,因为小时不能30度才走一个,要慢慢的走
//绘制数字
Paint paint2=new Paint();
paint2.setColor(Color.BLACK);
paint2.setTextSize(50);
for (int i = 1; i <13 ; i++) {
float tx=paint2.measureText(i+"")/2; //测量要画的字符的宽度
canvas.drawText(i+"",(float) (cx+radius*0.9*Math.sin(Math.toRadians(i*30)))-tx,(float)(cy-radius*0.9*Math.cos(Math.toRadians(i*30)))+tx,paint2);
}
//每秒刷新一次
postInvalidateDelayed(1000);
//绘制时针
Paint paint1=new Paint();
paint1.setColor(Color.BLUE);
paint1.setStrokeWidth(15);
paint1.setStrokeCap(Paint.Cap.ROUND);
paint1.setAntiAlias(true);
canvas.drawLine(cx,cy,(float) (cx+radius*0.5*Math.sin(Math.toRadians(fHour*30))),(float)(cy-radius*0.5*Math.cos(Math.toRadians(fHour*30))),paint1);
//绘制分针
paint2.setStrokeWidth(10);
paint2.setStrokeCap(Paint.Cap.ROUND);
paint2.setAntiAlias(true);
canvas.drawLine(cx,cy,(float) (cx+radius*0.7*Math.sin(Math.toRadians(minute*6))),(float)(cy-radius*0.7*Math.cos(Math.toRadians(minute*6))),paint2);
//绘制秒针
Paint paint3=new Paint();
paint3.setColor(Color.YELLOW);
paint3.setStrokeWidth(7);
paint3.setStrokeCap(Paint.Cap.ROUND);
paint3.setAntiAlias(true);
canvas.drawLine(cx,cy,(float) (cx+radius*0.9*Math.sin(Math.toRadians(second*6))),(float)(cy-radius*0.9*Math.cos(Math.toRadians(second*6))),paint3);
//绘制圆心
paint.setStyle(Paint.Style.FILL);
canvas.drawCircle(cx, cy, radius / 13, paint);
}
}
布局:
<?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:background="@mipmap/bg"
android:layout_height="match_parent"
tools:context="com.example.drawclock.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:textColor="#0ff"
android:textSize="40sp"
android:layout_height="wrap_content"
android:text="时钟" />
<com.example.drawclock.ClockView
android:id="@+id/aa"
android:layout_centerInParent="true"
android:layout_width="300dp"
android:layout_height="300dp" />
</RelativeLayout>
运行结果: