一、文字位置

1.绘制方法

public void drawText(@NonNull String text, float x, float y, @NonNull Paint paint)

重点参数：
x：文字所在矩形的相对位置
y：基线所在位置

2.通过设置画笔属性确定文字位置

设置方法：public void setTextAlign(Align align)

Align的类型：
Align.LEFT（默认值）、
Align.CENTER、
Align.RIGHT
效果如下图所示
图片描述
总结：该画笔属性可以确定 drawText 函数的（x,y）坐标点在文字所在矩形的相对位置

二、关于中心字

首先我们看下这幅图
图片描述
红线（topLine ）
绿线（ascentLine ）
蓝线（baseLineValue 基线）
黑线（descentLine ）
青线（bottomLine ）

要知道红、绿、黑、青线的位置，我们要关注 FontMetrics 类里面的 top,ascent,descent,bottom 这几个成员变量，这几个成员变量的值，都是通过画笔获取的系统给我们的建议值。表示它们各自所代表的线，和基线距离相差值(通过以下代码及Log验证)。

kotlin

复制代码

       val fontMetrics = mPaint.fontMetrics
       val top = fontMetrics.top
       val ascent = fontMetrics.ascent
       val descent = fontMetrics.descent
       val bottom = fontMetrics.bottom
       d("--------------top = $top")
       d("--------------ascent = $ascent")
       d("--------------descent = $descent")
       d("--------------bottom = $bottom")
       d("--------------baseLineValue = $baseLineValue")
    //基线位置
       val baseLineValue = 500f
       //红线位置
       val topLine = baseLineValue + top
       //绿线位置
       val ascentLine = baseLineValue + ascent
       //黑线位置
       val descentLine = baseLineValue + descent
       //青线位置
       val bottomLine = baseLineValue + bottom
       d("===============================================")
       d("--------------topLine=$baseLineValue + $top -> $topLine")
       d("--------------ascentLine=$baseLineValue + $ascent -> $ascentLine")
       d("--------------descentLine=$baseLineValue + $descent -> $descentLine")
       d("--------------bottomLine=$baseLineValue + $bottom -> $bottomLine")

看下log

plaintext

复制代码


com.wjm.viewup D/DrawTextUp: --------------top = -190.10742
com.wjm.viewup D/DrawTextUp: --------------ascent = -166.99219
com.wjm.viewup D/DrawTextUp: --------------descent = 43.945312
com.wjm.viewup D/DrawTextUp: --------------bottom = 48.779297
com.wjm.viewup D/DrawTextUp: --------------baseLineValue = 500.0
com.wjm.viewup D/DrawTextUp: ===============================================
com.wjm.viewup D/DrawTextUp: --------------topLine=500.0 + -190.10742 -> 309.89258
com.wjm.viewup D/DrawTextUp: --------------ascentLine=500.0 + -166.99219 -> 333.0078
com.wjm.viewup D/DrawTextUp: --------------descentLine=500.0 + 43.945312 -> 543.9453
com.wjm.viewup D/DrawTextUp: --------------bottomLine=500.0 + 48.779297 -> 548.7793

由上可知，红线（log中的topLine）位置= 基线位置（baseLineValue ） + top 值，其他线亦然

进入正题，画中心字，先明确一个问题：
drawText 函数的 y 参数即基线，确定的是字体底部的位置，那我们要让字对齐我们的中心线，就必须让字体偏移一段距离
图片描述

一、文字位置

1.绘制方法

2.通过设置画笔属性确定文字位置

二、关于中心字

三、Align参数的形象展示