1. 关于drawText
可能以前平时对绘制文字要求不高,没怎么关注过文字基线的文字,只是知道有这么个概念.上一篇文章中有一个绘制简单进度条的例子,里边就有居中绘制文字的代码。
代码是这样的:
float baseline = getHeight() * 2 / 3;
为什么我这样算呢?
因为文字的绘制,在Y轴来说是从基线开始的,基线就是四线格中的第三条线,它的位置刚好就是四线格的2/3的位置。所以这里就用 view的高度*2/3了。
这里因为是凑巧View的高度不是太高,所以并没有看出什么问题。想象一下如果View的高度是屏幕的高度,我还用View的高度的2/3位置作为基线还行么?
答案当然是不行了,基线的位置并不是单纯的从所在View的高度上决定的,而是根据文字的FontMetrics和View的中线确定的。
2. 推荐阅读
更加详细的解释请看drawText详解,这篇文章写得很清楚,而且也有推倒过程.
下边的例子就是使用大神文章中的方法计算的baseline做的一个环形进度条,加了自定义属性,可以在xml中设置文字的大小、文字颜色,进度条背景,进度条颜色,进度条宽度等。代码中有详细的注释。
效果图:
图中的圆环进度条就是这次的代码效果
环形进度条思路:
1. 自定义属性
-在attrs文件中声明需要的属性
绘制背景圆环
**-在onSizeChanged()方法中根据View的宽高计算中心点坐标和半径。
-注意:这个圆环是View的内切圆,计算半径需要减去圆环的宽度**绘制当前进度圆弧
**-根据当前进度值绘制圆弧,
-注意圆弧的起始角度,如果是0度,标识的是3点钟方向**绘制文字
-计算文字的baseline,计算方法在代码中也有,详细的推导过程,可以看下推荐的那篇文章
3.进度条代码
- 自定义属性
<declare-styleable name="CircleProgressView">
<attr name="progressTextSize" format="dimension|reference"/>
<attr name="progressTextColor" format="color|reference"/>
<attr name="progressBackGroundColor" format="color|reference"/>
<attr name="progressColor" format="color|reference"/>
<attr