文章目录

• TextPaint介绍
• 一、FontMetrics

• 1.1 理论知识
• 1.2 代码验证
• 1.3 fontMetrics中的变量和文字的size、typeface有关
• 1.4 绘制居中屏幕的文字

• 二、TextPaint中的各种方法
• 三、Typeface中的方法

• 3.2 扩展到TextView

TextPaint介绍

TextPaint 是 Paint 的子类，用它可以很方便的进行文字的绘制，一般情况下遇到绘制文字的需求时，我们一般用 TextPaint 所提供的方法。开始学习如何绘制文字之前，我们必须要先了解下 android 中文字是怎么绘制到屏幕上的，文字的格式又是怎么样的。

一、FontMetrics

1.1 理论知识

它是一个 Paint 的内部类，作用是“字体测量”。它里面呢就定义了 top,ascent,descent,bottom,leading 五个成员变量其他什么也没有，和 rect 很相似。如果你不信，我们可以去看看源码：

/**
     * Class that describes the various metrics for a font at a given text size.
     * Remember, Y values increase going down, so those values will be positive,
     * and values that measure distances going up will be negative. This class
     * is returned by getFontMetrics().
    public static class FontMetrics {
         * The maximum distance above the baseline for the tallest glyph in
         * the font at a given text size.
        public float   top;
         * The recommended distance above the baseline for singled spaced text.
        public float   ascent;
         * The recommended distance below the baseline for singled spaced text.
        public float   descent;
         * The maximum distance below the baseline for the lowest glyph in
         * the font at a given text size.
        public float   bottom;
         * The recommended additional space to add between lines of text.
        public float   leading;
    }

为了很好的理解这5个变量的意义，我们用下面的图示来进行说明。

• Baseline 是基线，在 Android 中，文字的绘制都是从 Baseline 处开始的
• ascent 意为上坡度： Baseline 往上至字符“最高处”的距离我们称之为 ascent ，
• descent 意为下坡度： Baseline 往下至字符“最低处”的距离我们称之为 descent ；
• leading（行间距） 则表示上一行字符的 descent 到该行字符的 ascent 之间的距离；
• top 和 bottom 文档描述地很模糊，其实这里我们可以借鉴一下 TextView 对文本的绘制， TextView 在绘制文本的时候总会在文本的最外层留出一些内边距，为什么要这样做？因为 TextView 在绘制文本的时候考虑到了类似读音符号，下图中的A上面的符号就是一个拉丁文的类似读音符号的东西：
  
  top 的意思其实就是除了 Baseline 到字符顶端的距离外还应该包含这些符号的高度， bottom 的意思也是一样。一般情况下我们极少使用到类似的符号所以往往会忽略掉这些符号的存在，但是 Android 依然会在绘制文本的时候在文本外层留出一定的边距，这就是为什么 top 和 bottom 总会比 ascent 和 descent 大一点的原因。而在 TextView 中我们可以通过 xml 设置其属性 android:includeFnotallow="false" 去掉一定的边距值但是不能完全去掉。

1.2 代码验证

为了测试一下上述的理论是否正确，我们写下了下面的代码：

private static final String TEXT = "ap卡了ξτβбпшㄎㄊěǔぬも┰┠№＠↓"; 
@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        mTextPaint.setTextSize(50);  
        mTextPaint.setColor(Color.BLACK);  
        FontMetrics fontMetrics = mTextPaint.getFontMetrics();  
        Log.d("Aige", "ascent：" + fontMetrics.ascent);  
        Log.d("Aige", "top：" + fontMetrics.top);  
        Log.d("Aige", "leading：" + fontMetrics.leading);  
        Log.d("Aige", "descent：" + fontMetrics.descent);  
        Log.d("Aige", "bottom：" + fontMetrics.bottom);  
        mTextPaint.clearShadowLayer();
        canvas.drawText(TEXT, 0, Math.abs(fontMetrics.top), mTextPaint);
    }

结果：

打印的Log：
ascent：-46.38672
top：-52.807617
leading：0.0
descent：12.207031
bottom：13.549805

注：Baseline上方的值为负，下方的值为正

我们来分析一下这个结果：

因为基线上方为负，所以 ascent 和 top 的值都是负数，而且 top 要大于 ascent ，原因是要为符号留出位置。

因为只有一行文本所以 leading 恒为0。

基线下方为正，所以 descent 和 bottom 都是正的， bottom 要略大于 descent

在得到的结果中，我们发现文字是紧紧贴着屏幕顶端的，再看下我们的程序代码：

canvas.drawText(TEXT, 0, Math.abs(fontMetrics.top), mTextPaint);

x坐标 是0， y坐标 是 Math.abs(fontMetrics.top) ，因为 android 是从基线开始绘制的，所以我们为了让字体顶端紧贴屏幕就必须让它移下来一点，移动的距离是 top 的距离，也就是基线到文字对顶部的距离。有人可能会问，如果不设置呢？x，y坐标都是0，是什么效果呢？因为 android 会从基线开始绘制，所以如果不做处理，基线就是屏幕的顶部，因此会出现如下的效果：

最终，我们验证了上面的理论是完全正确的。

1.3 fontMetrics中的变量和文字的size、typeface有关

从代码中我们可以看到一个很特别的现象，在我们绘制文本之前我们便可以获取文本的 FontMetrics 属性值，也就是说我们 FontMetrics 的这些值跟我们要绘制什么文本是无关的，而仅与绘制文本 Paint 的 size 和 typeface 有关。当你改变了 paint 绘制文字的 size 或 typeface 时， FontMetrics 中的 top 、 bottom 等值就会发生改变。如果我们仅仅更改了文字，这些值是不会发生任何改变的。

1.4 绘制居中屏幕的文字

我们知道了这些理论知识，也知道 android 是怎么绘制文字的，一会我们要做一个实际的例子来巩固巩固。首先，我们要先来扩展认识两个方法：

float android.graphics.Paint.descent()
解释：the distance below (positive) the baseline (descent) based on the current typeface and text size. 
一句话解释：得到下坡度的值
float android.graphics.Paint.ascent()
解释：the distance above (negative) the baseline (ascent) based on the current typeface and text size. 
一句话解释：就是得到上坡度的值

实际代码：

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        mTextPaint.setTextSize(50);
        mTextPaint.setColor(Color.BLACK);
        // 计算Baseline绘制的起点X轴坐标 ，计算方式：画布宽度的一半 - 文字宽度的一半
        int baseX = (int) (canvas.getWidth() / 2 - mTextPaint.measureText(TEXT) / 2);
        // 计算Baseline绘制的Y坐标 ，计算方式：画布高度的一半 - 文字总高度的一半
        int baseY = (int) ((canvas.getHeight() / 2) - ((mTextPaint.descent() + mTextPaint.ascent()) / 2));
        // 居中画一个文字
        canvas.drawText(TEXT, baseX, baseY, mTextPaint);
        mPaint.setColor(Color.RED);
        mPaint.setStrokeWidth(2);
        // 为了便于理解我们在画布中心处绘制一条中线
        canvas.drawLine(0, canvas.getHeight() / 2, canvas.getWidth(), canvas.getHeight() / 2, mPaint);
    }

我们计算了 x坐标 和 y坐标 。

• x坐标 的计算方法是 （屏幕宽度-文字宽度）/2 ，如果文字宽度比屏幕宽度长得到的就是负数，如果文字宽度比屏幕宽度短，得到的就是正数，这个很容易理解；
• y坐标 的的计算方式是 （屏幕高度-文字高度）/2 ，这里的文字高度用的是： descent+ascent（忽略了音标） 。

结果：

二、TextPaint中的各种方法

• float ascent()
  顾名思义就是返回上坡度的值
• float descent()
  得到下坡度的值
• breakText()

public int breakText (String text, boolean measureForwards, float maxWidth, float[] measuredWidth)
public int breakText (char[] text, int index, int count, float maxWidth, float[] measuredWidth)
public int breakText (CharSequence text, int start, int end, boolean measureForwards, float maxWidth, float[] measuredWidth)

这个方法让我们设置一个最大宽度，在不超过这个宽度的范围内返回实际测量值否则停止测量。
text : 表示我们的字符串；
start : 表示从第几个字符串开始测量；
end : 表示从测量到第几个字符串为止；
measureForwards : 表示向前还是向后测量；
maxWidth : 表示一个给定的最大宽度在这个宽度内能测量出几个字符；
measuredWidth : 为一个可选项，可以为空，不为空时返回真实的测量值

这些方法在一些结合文本处理的应用里比较常用，比如文本阅读器的翻页效果，我们需要在翻页的时候动态折断或生成一行字符串，这就派上用场了~

• getFontMetrics()
  得到一个 FontMetrics 对象。
• getFontMetrics (Paint.FontMetrics metrics)
  这个和我们之前用到的 getFontMetrics() 相比多了个参数， getFontMetrics() 返回的是 FontMetrics 对象，而 getFontMetrics(Paint.FontMetrics metrics) 返回的是文本的行间距，如果 metrics 的值不为空则返回 FontMetrics 对象的值。
• getFontMetricsInt()
  该方法返回了一个 FontMetricsInt 对象， FontMetricsInt 和 FontMetrics 是一样的，只不过 getFontMetricsInt() 得到的对象中的参数都是 int 类型，而 getFontMetrics() 返回对象中的参数都是 float 。
• getFontMetricsInt(Paint.FontMetricsInt fmi)
  得到文字的间距，距离是 int 类型
• getFontSpacing()
  返回字符行间距
• setUnderlineText(boolean underlineText)
  设置文字的下划线
• setTypeface(Typeface typeface)
  设置字体类型，上面我们也使用过。 Android 中字体有四种样式： BOLD（加粗） , BOLD_ITALIC（加粗并倾斜） , ITALIC（倾斜） , NORMAL（正常） ；

Android 为我们提供的字体有五种： DEFAULT, DEFAULT_BOLD, MONOSPACE, SANS_SERIF 和 SERIF ，我们也可以用自己定义的字体：

Paint p = new Paint();  
String familyName = "宋体";  
Typeface font = Typeface.create(familyName, Typeface.BOLD);  
p.setColor(Color.RED);  
p.setTypeface(font);

• setTextSkewX(float skewX)
  设置文本在水平方向上的倾斜。这个倾斜值没有具体的范围，但是官方推崇的值为-0.25可以得到比较好的倾斜文本效果，值为负右倾值为正左倾，默认值为0。
• setTextSize (float textSize)
  设置文字的大小，但是要注意该值必需大于零。
• setTextScaleX (float scaleX)
  将文本沿X轴水平缩放，默认值为1，当值大于1会沿X轴水平放大文本，当值小于1会沿X轴水平缩放文本

// 设置画笔文本倾斜  
textPaint.setTextScaleX(0.5F);

// 设置画笔文本倾斜  
textPaint.setTextScaleX(1.5F);

注意： setTextScaleX 不仅放大了文本宽度同时还拉伸了字符！这是亮点~

• setTextLocale (Locale locale)
  设置地理位置，这里如果你要使用，直接传入 Locale.getDefault() 即可。
• setTextAlign (Paint.Align align)
  设置文本的对齐方式，可供选的方式有三种： CENTER, LEFT 和 RIGHT 。

我们的文本大小是通过 size 和 typeface 确定的（其实还有其他的因素但这里影响不大忽略），一旦 baseline 确定，对不对齐好像不相干吧。但是，你要知道一点，文本的绘制是从 baseline 开始没错，但是是从哪边开始绘制的呢？左端还是右端呢？而这个 Align 就是为我们定义在 baseline 绘制文本究竟该从何处开始，上面我们在进行对文本的水平居中时是用 Canvas 宽度的一半减去文本宽度的一半：

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        mTextPaint.setTextSize(50);
        mTextPaint.setColor(Color.BLACK);
        // 计算Baseline绘制的起点X轴坐标 ，计算方式：画布宽度的一半 - 文字宽度的一半
        int baseX = (int) (canvas.getWidth() / 2 - mTextPaint.measureText(TEXT) / 2);
        // 计算Baseline绘制的Y坐标 ，计算方式：画布高度的一半 - 文字总高度的一半
        int baseY = (int) ((canvas.getHeight() / 2) - ((mTextPaint.descent() + mTextPaint.ascent()) / 2));
        // 居中画一个文字
        canvas.drawText(TEXT, baseX, baseY, mTextPaint);
        mPaint.setColor(Color.RED);
        mPaint.setStrokeWidth(2);
        // 为了便于理解我们在画布中心处绘制一条中线
        canvas.drawLine(0, canvas.getHeight() / 2, canvas.getWidth(), canvas.getHeight() / 2, mPaint);
    }

实际上我们大可不必这样计算，我们只需设置 Paint 的文本对齐方式为 CENTER ， drawText 的时候起点 x = canvas.getWidth() / 2 即可。产生的效果是，文字先算好一个基准线，从这个基准线的中点开始向左右开始绘制文字，最终自然就变成了居中显示了。如果你设定了 RIGHT ，那么从 baseline 的右边的顶点开始，文字开始慢慢绘制。

textPaint.setTextAlign(Align.CENTER);  
canvas.drawText(TEXT, canvas.getWidth() / 2, baseY, textPaint);

当我们将文本对齐方式设置为 CENTER 后就相当于告诉 Android 我们这个文本绘制的时候从文本的中点开始向两端绘制；如果设置为LEFT则从文本的左端开始往右绘制；如果为 RIGHT 则从文本的右端开始往左绘制：

• setSubpixelText (boolean subpixelText)
  设置是否打开文本的亚像素显示，什么叫亚像素显示呢？你可以理解为对文本显示的一种优化技术，如果大家用的是 Win7+ 系统可以在控制面板中找到一个叫 ClearType 的设置，该设置可以让你的文本更好地显示在屏幕上就是基于亚像素显示技术。
• setStrikeThruText (boolean strikeThruText)
  文本删除线
• setLinearText (boolean linearText)
  设置是否打开线性文本标识，这玩意对大多数人来说都很奇怪不知道这玩意什么意思。想要明白这东西你要先知道文本在 Android 中是如何进行存储和计算的。在 Android 中文本的绘制需要使用一个 bitmap 作为单个字符的缓存，既然是缓存必定要使用一定的空间，我们可以通过 setLinearText (true) 告诉 Android 我们不需要这样的文本缓存。
• setFakeBoldText (boolean fakeBoldText)
  设置文本仿粗体
• measureText (String text)
• measureText (CharSequence text, int start, int end)
• measureText (String text, int start, int end)
• measureText (char[] text, int index, int count)
  测量文本宽度，上面我们已经使用过了，这四个方法都是一样的只是参数稍有不同罢了。

三、Typeface中的方法

• defaultFromStyle(int style)
  最简单的，简而言之就是把上面所说的四种 Style 封装成 Typeface 。传入的参数是： BOLD（加粗） , BOLD_ITALIC（加粗并倾斜） , ITALIC（倾斜） , NORMAL（正常）

mTextPaint.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD));

• create(String familyName, int style)
• create(Typeface family, int style)

textPaint.setTypeface(Typeface.create("SERIF", Typeface.NORMAL));  
textPaint.setTypeface(Typeface.create(Typeface.SERIF, Typeface.NORMAL));

这两个方法执行的效果完全一样。

• createFromAsset(AssetManager mgr, String path)
• createFromFile(String path)
• createFromFile(File path)
  这三者也是一样的，它们都允许我们使用自己的字体比如我们从 asset 目录读取一个字体文件。下面是一个简单的例子：

// 获取字体并设置画笔字体  
Typeface typeface = Typeface.createFromAsset(context.getAssets(), "kt.ttf");  
textPaint.setTypeface(typeface);

3.2 扩展到TextView

说到文本大家第一时间想到的应该是 TextView ，其实在 TextView 里我们依然可以找到上面很多方法的影子，比如我们可以从 TextView 中获取到 TextPaint ：

TextPaint paint = mTextView.getPaint();

当然也可以设置 TextView 的字体等等：

Typeface typeface = Typeface.createFromAsset(getAssets(), "kt.ttf");  
mTextView.setTypeface(typeface);