Canvas的drawText方法详解

通过Canvas的一些方法画圆，画矩形或者图像的时候，我们都需要有有一个定位坐标，即把圆或者矩形，画在画布上的上面位置，如：

• 画圆：需要确定圆心，圆心确定了，圆的位置也就确定了。
• 画矩形：需要确定左上角的坐标，坐标确定了，矩形的位置也就确定了。

思考：如果我们画的是文字，那又改采用什么样的规则去画呢？

1、四线格与基线
小时候，我们在刚开始学习写字母时，用的本子是四线格的，我们必须把字母按照规则写在四线格内。
比如：

那么问题来了，在canvas在利用drawText绘制文字时，也是有规则的，这个规则就是基线！
我们先来看一下什么是基线：

可见基线就相当于四线格中的第三条线！
也就是说，只要基线的位置定了，那文字的位置必然是定了的！

对图中的词语解释：

• top：画文字的时候的顶部边界坐标，文字不会碰到这条线。
• bottom：画文字的时候的底部边界坐标，文字不会碰到这条线。
• ascent：画文字的时候，顶部不会超过这条线。
• descent：画文字的时候，底部不会超过这条线。
• baseline：画文字的时候需要的基线。

2、计算 基线baseline的y坐标：
为了计算baseline的y坐标，这里通过一幅图帮助我们理解：

在Paint的内部有一个内部类：FontMetrics，在它里面封装了一些属性，如：top，bottom，ascent，descent等。
**top：**就是top线的y坐标-baseline的y坐标的值，因为Android的坐标系我们可以知道，baseline的y坐标大于top线的y坐标，所以FontMetrics的top属性值永远都是负值。
**bottom：**就是bottom线的y坐标-baseline的y坐标的值>0。
文字的高度=bottom-top；

计算baseline的y坐标，分如下两种情况：

假设baseline的y坐标为baselineY

（1） 如果View是wrap_content的，那么view的高度就是文字的高度：
baselineY=-FontMetrics.top,即取正值。
如果我们设置的值比FontMetrics.top这个值小，那么文字就会显示不完整了。
实例代码如下：

Paint paint = new Paint();
paint.setColor(Color.RED);
paint.setTextSize(80);
paint.setStyle(Paint.Style.FILL);
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
//canvas.drawText("世界和平", 0, Math.abs(fontMetrics.top), paint);//文字完全显示
canvas.drawText("世界和平", 0, 20, paint);//文字会显示不全

文字完全显示的实现效果如下：

显示不全的效果图如下：

**（2）如果View的高度大于文字的高度：**假设文字垂直居中
空件的高度viewHeight，
文字的高度为textHeight=FontMetrics.bottom-FontMetrics.top;
baselineY=(viewHeight-textHeight)/2+textHeight-FontMetrics.bottom,
简化后baselineY=viewHeight/2+textHeight/2-FontMetrics.bottom。
即：baselineY=viewHeight/2-FontMetrics.top/2-FontMetrics.bottom/2。
代码如下：

Paint paint = new Paint();
paint.setColor(Color.BLUE);
Rect rect = new Rect(0, 0, getWidth(), 200);
canvas.drawRect(rect, paint);

paint.setColor(Color.RED);
paint.setTextSize(80);
paint.setStyle(Paint.Style.FILL);
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
int baseline = (int) ((rect.bottom - rect.top) / 2 
+ (fontMetrics.bottom - fontMetrics.top) / 2 - fontMetrics.bottom);
canvas.drawText("世界和平", 0, baseline, paint);

实现效果图：

可以看到，文字时居中的。

总结：我们利用Paint.FontMetrics类提供的top和bottom属性，就可以计算出baseline的y坐标，至此，我们可以根据baseline的了解，实现一个文字的居中显示，居左显示，居上显示等特性的TextView。