首页 > 系统 > Android > 正文

《Android群英传》 使用Canvas绘图

2019-11-08 00:29:55
字体:
来源:转载
供稿:网友

先上图

在看徐医生的《Android群英传》的android绘制技巧(117页),遇到canvas绘图。于是就实现了下书上的代码。顺便扩展了一下,画了一个时间表。 代码地址:时间表 时间表

Paint

setAntiAlias(boolean);//设置锯齿 setColor();//设置画笔颜色 setARGB();//设置画笔的ARGB setAlpha();//设置透明度 setTextSize();//设置字体大小 setStyle();//设置风格,有三种可选。Stroke,Fill,Stroke And Fill setStrokeWidth();//设置边框跨度

measureText();//获取该字体宽度

Canvas绘图

一般使用的方法:

drawPoint(x,y,paint);drawLine(startX,startY,endX,endY);drawLines(float[],paint);drawRect(left,top,right,bottom,paint);drawRoundRect(left,top,right,bottom,radiusX,radiusY,paint);drawCircle(circleX,circleY,radis,paint);drawArc();//绘制弧形和扇形drawOval();drawText(text,startX,startY,paint);drawPosText();//在指定位置上画字drawPath();//绘制路径

绘制技巧:

canvas.save();canvas.restore();canvas.translate(px,py);//平移画布,正右负左canvas.rotate(degrees);canvas.rotate(degrees,pivotX,pivotY);//以该点为圆心顺时针旋转

代码

在画该时间表时,难的就是对平移到圆心之后的canvas的旋转。期间配合save()和restore()方法不断进行入栈和出栈操作,使canvas将指针画在正确的位置上。

canvas.save();//保存当前画布 canvas.translate(mWidth / 2, mHeight / 2);//平移到圆心 //画时针,单独开画布,以免影响后续操作 canvas.save(); canvas.rotate(30 * (hour - 3)); canvas.drawLine(0, 0, 150, 0, hourPaint); canvas.restore(); //画分针 canvas.save(); canvas.rotate(6 * (minute - 15)); canvas.drawLine(0, 0, 320, 0, minutePaint); canvas.restore(); //画秒针 canvas.rotate(6 * (second - 15), 0, 0); canvas.drawLine(0, 0, mWidth / 2 - 100, 0, secondPaint); canvas.restore();

完成第一步正确定位后,又使用postDelay()方法使该自定义控件执行定时事件,像钟表一样一秒一秒的走。

init(){ post(timeClick); } Runnable timeClick = new Runnable() { @Override public void run() { Calendar instance = Calendar.getInstance(); int startHour = instance.get(Calendar.HOUR); int startMinute = instance.get(Calendar.MINUTE); second = instance.get(Calendar.SECOND); //精确计算时间和分钟 hour = startHour + startMinute / (float) 60 + second / (float) 3600; minute = startMinute + second / (float) 60; LogUtil.d(hour + ", " + minute + ", " + second); postInvalidate(); postDelayed(this, 1000);//重复执行该动作,使秒针动起来 } };

在onMeasure()中已经支持wrap_content,之后有时间支持padding属性。


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表