自定义view 中绘制文字是非常常见的操作,但是如果不知道文字的绘制锚点就没有办法让文字绘制到我们想要绘制的位置,这篇文章就为大家具体讲解一下怎么让文字显示到我们想要显示的位置,首先上代码和代码运行后的截图
/**
* 文字
* @param canvas
*/
private void drawText(Canvas canvas) {
Rect rect = new Rect((int)left, (int)top, width, height/2);
String testString = "测试:wanghj:4568";
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setStrokeWidth(2);
paint.setTextSize(40);
paint.setColor(Color.WHITE);
canvas.drawRect(rect, paint);
paint.setColor(Color.RED);
canvas.drawText(testString, rect.left, rect.bottom, paint);
}
如果是第一次接触这块肯定和自己预想的不太一样,drawText方法第一个参数和最后一个参数分别是绘制的文字和画笔,但是第二个参数和第三个参数正常的理解不应该是绘制文字的左上角的点吗?毕竟大部分自定义控件的绘制都是这样的,MY GOD这是什么情况呢?
看下面这张图,我们来详细解释一下
通过这张图的比较至少我们知道了最底部是以baseline为准的。程序运行的结果我们就不难理解了。
那这四条线分别代表什么意思呢?下面我们详细的来说一下
ascent: 系统建议的,绘制单个字符时,字符应当的最高高度所在线
descent: 系统建议的,绘制单个字符时,字符应当的最低高度所在线
top: 可绘制的最高高度所在线
bottom: 可绘制的最低高度所在线
这四个值怎么获取呢?
Android给我们提供了一个类:FontMetrics,它里面有四个成员变量:
ascent = ascent线的y坐标 - baseline线的y坐标;
descent = descent线的y坐标 - baseline线的y坐标;
top = top线的y坐标 - baseline线的y坐标;
bottom = bottom线的y坐标 - baseline线的y坐标;
我们添加代码,打印 log
Paint.FontMetrics fontMetrics = paint.getFontMetrics();
float top = fontMetrics.top;
float bottom = fontMetrics.bottom;
float ascent = fontMetrics.ascent;
float descent = fontMetrics.descent;
Log.d("wanghj","top---->"+top+"bottom---->"+bottom+"ascent---->"+ascent+"descent---->"+descent);
下面是log打印结果:
wanghj: top—->-43.710938bottom—->10.839844ascent—->-37.109375descent—->9.765625
文字最常用的就是指定父控件,然后让文字居中对齐,知道上面的基础知识后,那么我们怎么让文字居中对齐呢?下面就详细的说一下:
FontMetrics.top的数值是个负数,其绝对值就是字体绘制边界到baseline的距离。
所以如果是把文字画在 FontMetrics高度的矩形中, drawText就应该传入 -FontMetrics.top。
要画在制定区域的居中位置,y值的计算公式就是:
targetRect.centerY() - (FontMetrics.bottom - FontMetrics.top) / 2 - FontMetrics.top
下面我们添加代码
float y = rect.centerY()-(bottom-top)/2-top;
canvas.drawText(testString, rect.left, y, paint);
下图就是绘制之后的结果:
冰冻三尺非一日之寒~大家一起努力!