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

举报
韩曙亮 发表于 2022/01/11 01:56:14 2022/01/11
【摘要】 文章目录 一、测量文本真实边界二、将文本中心点与给定中心点对齐 一、测量文本真实边界 Paint.getTextBounds() 函数原型如下 : public ...





一、测量文本真实边界



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

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);
    }
}

  
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21

获取边界代码示例 :

Rect rect = new Rect();
paint.getTextBounds(text, 0, text.length(), rect);

  
 
  • 1
  • 2

获取的边界值 , 并不是绘制该文本的坐标 , 是使用 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 边界确定文本位置 ;

在这里插入图片描述

文章来源: hanshuliang.blog.csdn.net,作者:韩曙亮,版权归原作者所有,如需转载,请联系作者。

原文链接:hanshuliang.blog.csdn.net/article/details/121384211

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。