首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >【Android 应用开发】Canvas 精准绘制文字 ( 测量文本真实边界 | 将文本中心点与给定中心点对齐 )

【Android 应用开发】Canvas 精准绘制文字 ( 测量文本真实边界 | 将文本中心点与给定中心点对齐 )

作者头像
韩曙亮
发布2023-03-29 21:03:00
发布2023-03-29 21:03:00
2.6K0
举报

文章目录

一、测量文本真实边界


Paint.getTextBounds() 函数原型如下 :

代码语言:javascript
复制
public class Paint {
    /**
     * 检索文本边界框并存储到边界。
     *
     * 在边界内返回(由调用方分配)包含所有字符的最小矩形,其隐含原点为(0,0)。
     *
     * @param text 测量的字符串并返回其边界
     * @param start 要测量字符串的起始位置
     * @param end 要测量字符串的结束位置 + 1
     * @param bounds 返回所有文本的联合边界。必须由调用方分配
     */
    public void getTextBounds(String text, int start, int end, Rect bounds) {
        if ((start | end | (end - start) | (text.length() - end)) < 0) {
            throw new IndexOutOfBoundsException();
        }
        if (bounds == null) {
            throw new NullPointerException("need bounds Rect");
        }
        nGetStringBounds(mNativePaint, text, start, end, mBidiFlags, bounds);
    }
}

获取边界代码示例 :

代码语言:javascript
复制
Rect rect = new Rect();
paint.getTextBounds(text, 0, text.length(), rect);

获取的边界值 , 并不是绘制该文本的坐标 , 是使用 Paint 在 Canvas 中绘制的文本的真实占用区域 , 如下图红色矩形框所在的区域 , 与文本的相对坐标 , 下图的红色矩形框的 右下角是 ( 0 , 0 ) 坐标位置 ;

Rect 中获取的坐标值示例 : left = 4 , top = -31 , right = 28 , bottom = 0 ;

下图中红色矩形框是 绘图占用范围 , 蓝色矩形框是 文本占用的范围 , 绘图占用范围要大于文本占用范围 ;

left 和 right 值 , 是相对于 左侧的真实值 ;

top 和 bottom 值 , 是相对于 文本 基线值的相对值 , top = -31 , 说明文本的顶部在基线上方 31 像素位置 , bottom = 0 , 说明文本的底部就是基线 ;

上述 Rect 的坐标轴是这么算的 , x 轴是文本的基线轴 , y 轴是绘图区域的左侧边界 ;

一定要确定两个概念 , 下图 红色矩形框 的区域 是 绘图区域 , 下图 蓝色矩形框的区域 是文本区域 ;

绘图区域 不等于 文本区域 , 文本一定在绘图区域中 , 但是具体在哪 , 不确定 , 可能在中心 , 可能在下方 , 可能在右上角 , 这是根据文本的特性确定的 , 如有的文本时 abcd 类型的 , 下方没有超出基线 , 有的文本属于 jqpy 类型的 , 下方超出基线了 , 还有可能有特殊符号如度数符号 , 百分号等 , 造成了真实文本与绘图区域的差异 ;

绘图区域 与 真实文本区域 的差异 , 就导致了 文字绘图 不准确 , 不好定位的问题 ;

二、将文本中心点与给定中心点对齐


给定中心点 ( x , y ) ;

绘制文本 , 使得 文本的中心点 与 给定的中心点对齐 ;

根据中心点位置 :

确定绘制文本的左侧位置 : x - (rect.left + rect.right) / 2 , 绘制的文本 , 是下图红色矩形框的位置 , 文本的位置是不确定的 , 可能在红色矩形框内的任意位置 , 需要借助 Rect 边界确定文本位置 ,

确定绘制文本的顶部位置 : y - (rect.top + rect.bottom) / 2 , 绘制的文本 , 是下图红色矩形框的位置 , 文本的位置是不确定的 , 可能在红色矩形框内的任意位置 , 需要借助 Rect 边界确定文本位置 ;

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-11-17,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 文章目录
  • 一、测量文本真实边界
  • 二、将文本中心点与给定中心点对齐
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档