canvas的drawText 如何将文字绘制在控件的中心

canvas.drawText(String text,float x,float y,Paint mTextPaint);

第一个参数就不用说,就是你要写的字

第二个参数就是从哪里开始写  一般就是1/2*height+mTextPaint.measureText(text)/2;

然后第三个参数就是最麻烦的

先看一张图

y坐标就是baseline所在的那条线

那我们先假设 如果我们一开始设置baseline是1/2*控件的高度(下面都用height)那么我们看一下效果,我写了一个简单的demo

代码:

protected void onDraw(Canvas canvas) {
canvas.drawCircle(width/2, height/2, width/2, mCirclePaint);
float textWidth=mTextPaint.measureText(text);
float Textx=width/2-textWidth/2;
canvas.drawText(text, Textx, height/2, mTextPaint);
}

看一下效果:

可以很明显的看到有点靠上了,达不到在中间的效果,这样做的效果其实就是第一张图中我们把baseline设置到了红线的上面(红线你可以看成(font.descent-font.ascent)/2(因为ascent是基于baseline上面,所以是负数,反之descent是整数,相减就是他们之间的距离)),现在我们要把baseline往下移了,那么移动的距离就是就是红线到baseline的距离,因为红线可以看成是(font.descent-font.ascent)/2,所以这个值减去font.descent就是红线与baseline的距离,然后最后的公式就是:

float dy=(fontMetrics.descent-fontMetrics.ascent)/2-fontMetrics.descent;//红线与baseline距离

float Texty=height/2+dy;//这就是y的值了!

注:为什么说我们把baseline设置到了红线的上面,你就想height/2的view的中间轴,(font.descent-font.ascent)/2是文字的中间轴,就比如(0+10)/2==(3+7)/2,我就不多说了吧!

最后附上代码和效果图：

protected void onDraw(Canvas canvas) {
canvas.drawCircle(width/2, height/2, width/2, mCirclePaint);
float textWidth=mTextPaint.measureText(text);
float Textx=width/2-textWidth/2;
FontMetrics fontMetrics=mTextPaint.getFontMetrics();
float dy=(fontMetrics.descent-fontMetrics.ascent)/2-fontMetrics.descent;
float Texty=height/2+dy;
canvas.drawText(text, Textx, Texty, mTextPaint);
}