本来这篇文章是要写写我在设计高级跑马灯程序的心得的，但是编写过程中花了近一天多的时间搞明白canvas.drawText中的第三个参数[float y]代表的真实含义。学习本文应该能帮助大家掌握FontMetrics类和Rect类成员变量值具体含义。
drawText引出问题
先来看看api中是如何定义drawText的参数。
/**
* Draw the text, with origin at (x,y), using the specified paint. The
* origin is interpreted based on the Align setting in the paint.
*
* @param text The text to be drawn
* @param x The x-coordinate of the origin of the text being drawn
* @param y The y-coordinate of the baseline of the text being drawn
* @param paint The paint used for the text (e.g. color, size, style)
*/
public void drawText(@NonNull String text, float x, float y, @NonNull Paint paint) {
native_drawText(mNativeCanvasWrapper, text, 0, text.length(), x, y, paint.mBidiFlags,
paint.getNativeInstance(), paint.mNativeTypeface);
}简单解释下各参数：
@param text：要显示的文本内容，这个不难理解。
@param x：文本相对屏幕原点x方向距离，没有更深的含义，也比较好理解
@param y：文本的baseline相对屏幕原点y方向距离。好，问题来了，baseline是个什么鬼东东
@param paint：画笔
baseline的来龙去脉
先看看baseline在文字区域的位置。通过一个实例来分析，这里只贴主要的code。
@Override
protected void onDraw(Canvas canvas) {
//super.onDraw(canvas);
mRect = new Rect();
mPaint = new Paint();
mPaint.setTextSize(64);
mPaint.setColor(Color.RED);
Paint.FontMetricsInt fontMetrics = mPaint.getFontMetricsInt();
mPaint.getTextBounds(textStr, 0, textStr.length(), mRect);
int w = mRect.width();
int h = mRect.height();
mRect = new Rect(mRectLeft, mRectTop, mRectLeft+w, mRectTop+(-fontMetrics.top)+fontMetrics.bottom);
canvas.drawRect(mRect, mPaint);
mBaseLine = (mRect.bottom+mRect.top)/2
- (fontMetrics.bottom+fontMetrics.top)/2;
mBaseLine = -fontMetrics.top;
/*其中y == mBaseLine的值*/
mPaint.setColor(Color.WHITE);
canvas.drawText(textStr, mRectLeft, mBaseLine, mPaint);
mPaint.setColor(Color.BLUE);
mPaint.setStrokeWidth(3);
/*将mBaseLine所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine, mRectLeft+w, mBaseLine, mPaint);
}效果图：
分析
从上图可以看出来，baseline并不是文字区域的底部，但是这根线的位置相信大家都熟悉，除非你没有学过英语。
FontMetrics
FontMetrics是Paint静态内部类，主要定义了Paint绘制文本时的关键坐标。API中这么描述：
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(). 主要意思：根据设定的fontsize来获得字体的各种变量值。通过getFontMetrics()方法来获取。
FontMetrics类含有5个成员变量：
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;
}很明显所有的值都是基于baseline来算的。这里我主要关注top这个值的定义。
top：api的注释翻译过来意思是字体可绘制区域最高位置与baseline的距离。但是它是个负数，所以-top就是我们的baseline坐标值。
ascent：字体下单个字符最高位置与baseline的距离
descent：字体下单个字符最低位置与baseline的距离，与ascent镜像对应
bottom：字体可绘制区域最低位置与baseline的距离。
leading：字面翻译是文本线额外的空间。一般都为0，不知道有何用处。
Rect
Rect类表示的一块矩形区域。Paint类中getTextBounds()方法可以获取对应font size下文本所占用矩形区域。记住这个矩形区域的坐标值也是相对baseline来计算的。
Rect类成员变量有4个，分别是left、top、right、bottom。由于文本的rect区域是相对baseline来计算的，因此真实的top跟bottom都要加上baseline的值。
借助一个实例来理解FontMetrics和Rect
主要源码：
@Override
protected void onDraw(Canvas canvas) {
//super.onDraw(canvas);
mRect = new Rect();
mPaint = new Paint();
mPaint.getTextBounds(textStr, 0, 1, mRect);
mPaint.setTextSize(textSize);
mPaint.setColor(0xffF4A460);
Paint.FontMetricsInt fontMetrics = mPaint.getFontMetricsInt();
mPaint.getTextBounds(textStr, 0, textStr.length(), mRect);
int w = mRect.width();
int h = mRect.height();
/*给fontMetrics区域填充0xffF4A460色*/
mRect = new Rect(mRectLeft, mRectTop, mRectLeft+w, mRectTop+(-fontMetrics.top)+fontMetrics.bottom);
canvas.drawRect(mRect, mPaint);
/*计算baseline，其中mRectTop是控件顶部到父view的距离*/
mBaseLine = -fontMetrics.top + mRectTop;
/*其中y == mBaseLine的值*/
mPaint.setColor(Color.WHITE);
canvas.drawText(textStr, mRectLeft, mBaseLine, mPaint);
mPaint.setColor(Color.BLUE);
mPaint.setStrokeWidth(4);
/*蓝色线：将mBaseLine所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine, mRectLeft+w, mBaseLine, mPaint);
mPaint.setColor(Color.GREEN);
/*绿色线：将文字区域的bottom所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine+fontMetrics.bottom, mRectLeft+2*w
, mBaseLine+fontMetrics.bottom, mPaint);
mPaint.setColor(Color.RED);
/*红色线：将文字区域的top所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine+fontMetrics.top, mRectLeft+2*w
, mBaseLine+fontMetrics.top, mPaint);
mPaint.setColor(Color.GRAY);
/*灰色线：将文字区域的ascent所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine+fontMetrics.ascent, mRectLeft+w+50
, mBaseLine+fontMetrics.ascent, mPaint);
mPaint.setColor(Color.WHITE);
/*白色线：将文字区域的descent所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine+fontMetrics.descent, mRectLeft+w+50
, mBaseLine+fontMetrics.descent, mPaint);
mPaint.setColor(Color.YELLOW);
/*黄色线：将文字区域的leading所在的位置画出来*/
canvas.drawLine(mRectLeft, mBaseLine+fontMetrics.leading, mRectLeft+w/2
, mBaseLine+fontMetrics.leading, mPaint);
/*将“测”字的rect用矩形绘出来*/
mPaint.setColor(Color.BLACK);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.getTextBounds(textStr, 0, 1, mRect);
mRect.top+=mBaseLine;
mRect.bottom+=mBaseLine;
canvas.drawRect(mRect, mPaint);
/*将“测试:12hg”字的rect用矩形绘出来*/
mPaint.setColor(Color.BLACK);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.getTextBounds(textStr, 0, 7, mRect);
mRect.top+=mBaseLine;
mRect.bottom+=mBaseLine;
canvas.drawRect(mRect, mPaint);
}
效果图：
FontMetrics：
1. 浅黄色区域就是文字的FontMetrics区域，可以看出来文字实在此区域垂直居中绘制
2. 红色线：为FontMetrics的top
3. 灰色线：为FontMetrics的ascent
4. 黄色线：为FontMetrics的leading
5. 蓝色线：为baseline线
6. 白色线：为FontMetrics的descent
7. 绿色线：为FontMetrics的bottom
Rect：
1. 第一个小黑矩形为“测”字的rect区域
2. 第二个长黑矩形为“测试:12hg”字的rect区域
总结
只要彻底弄明白baseline才能轻松掌握drawText接口，才不至于开发的时候总是搞不明白绘制的文字要么偏上要么偏下。
参考
http://blog.csdn.net/hursing/article/details/18703599
http://892848153.iteye.com/blog/2205002
http://blog.csdn.net/linghu_java/article/details/46404081