自定义view中文字位置的确定

自定义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);

下图就是绘制之后的结果:
这里写图片描述

冰冻三尺非一日之寒~大家一起努力!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值