重新认识FontMetrics、Canvas.drawText

最新推荐文章于 2021-02-18 15:25:55 发布

原创最新推荐文章于 2021-02-18 15:25:55 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#FontMetrics #文字居中绘制 #自定义View

Android View核心专栏收录该内容

5 篇文章

订阅专栏

本文探讨了在自定义View中使用FontMetrics类精确控制文本的位置，特别是如何找到文本的中间基准点进行居中显示。通过实际案例，展示了不同字符类型（如阿拉伯数字、汉字及表情符号）在FontMetrics中的表现差异。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

常常需要在自定义view中绘制文字时遇到在视图中间位置绘制一行文本，但是每次苦于找不到恰到好处的基准点，每次都要百度上搜来搜去，结果也是有很多种不统一的方法，今天决定好好研究一下FontMetrics这个类，以下一些心得记录：

1，阿拉伯数字、汉字、英文字母大小写、表情符号的FontMetrics基准线是不同的，如下图可以看到数字和大写字母还是比较整齐的。（ascent等是打印出的Paint.FontMetrics参数值，从最上的白线开始，依次为白线(top)、红线（ascent）、灰线（计算出的中间线，下文有解释）、绿线（leading）、黄线（descent），FontMetrics.bottom（蓝线）由于和descent几乎重合，并没有显示出来）

2，代码：

        Paint.FontMetrics metrics = paint.getFontMetrics();
        float basetop = 60;
        canvas.drawText(sample, 0, basetop, paint);

        paint.setColor(Color.RED);//
        canvas.drawLine(0, basetop + metrics.ascent, getWidth(), basetop + metrics.ascent, paint);

        paint.setColor(Color.BLUE);//
        canvas.drawLine(0, basetop + metrics.bottom, getWidth(), basetop + metrics.bottom, paint);

        paint.setColor(Color.YELLOW);//
        canvas.drawLine(0, basetop + metrics.descent, getWidth(), basetop + metrics.descent, paint);

        paint.setColor(Color.GREEN);//基准点
        canvas.drawLine(0, basetop + metrics.leading, getWidth(), basetop + metrics.leading, paint);

        paint.setColor(Color.WHITE);
        canvas.drawLine(0, basetop + metrics.top, getWidth(), basetop + metrics.top, paint);

        paint.setColor(Color.WHITE);//中间线
        canvas.drawLine(0, basetop + (metrics.top + metrics.bottom) / 2, getWidth(), basetop + (metrics.top + metrics.bottom) / 2, paint);

3，如果想把字符串"1234"绘制到view正中间，首先需要计算出drawText的floatY参数，也就是FontMetrics.leading在View视图中的Y坐标值。

我的计算方法是：Y= View.height * 1.0 / 2 - (metrics.bottom + metrics.top) / 2

(metrics.bottom + metrics.top) / 2的正整数刚好是leading到文字中间的长度