Android文字基线Baseline算法的使用讲解

引言

Baseline是文字绘制时所参照的基准线，只有先确定了Baseline的位置，我们才能准确的将文字绘制在我们想要的位置上。Baseline的概念在我们使用TextView等系统控件直接设置文字内容时是用不到的，但是如果我们想要在Canvas画布上面绘制文字时，Baseline的概念就必不可少了。

我们先了解一下Android中Canvas画布绘制文字的方法，如下图：

参数示意：

  • text，文字内容
  • x，文字从画布上开始绘制的x坐标（Canvas是一个原点在左上角的平面坐标系）
  • y，Baseline所在的y坐标，不少人已开始以为y是绘制文字区域的底部坐标，其实是不正确的，这是两个概念
  • paint，画笔，设置的文字的大小颜色等属性
  • 了解了文字绘制的方法，我们现在就了解一下这个参数y（Baseline）的计算方法。

Baseline的概念

我们先看一行文字各区域的分布示意图

从上图来看，Baseline不难理解，它就是E和h的下边界线。我们还可以得出一个结论，文字的高度=Descent+Ascent。

然而，上面这个公式并不完全准确，我们再看一个图：

我们看到，如果文字的上方有一些特殊的符号，比如上图中的~或者是我们汉语拼音中的声调时，文字区域又会多出一部分Leading。

因此，完整的公式应该是

文字的高度=Descent+Ascent+Leading。

那么，为什么第一幅图中没有说明Leading的存在呢，原因是我们通常在绘制一行英文或者中文时，Leading的高度为0。我们看一个证据图，下图是在绘制英文文字时调试取得的数据。

其中leading=0，所以我们在文字绘制时不需要考虑Leading，图中的数值都是距离Baseline的距离，在Baseline上方为负值，下方为正值。

Baseline位置（y轴坐标）的计算

为了方便我们对计算过程进行理解，我画了一幅帮助图，如下：

假设我们是在画布Canvas的顶部绘制一行文字，规定一行文字的高度是y，文字区域的高度是Height（TOP和BOTTOM之间，TOP到0和BOTTOM到y的距离相等，这样文字才看起来是居中）。因此，0到y和TOP到BOTTOM的中线是重合的，y轴坐标都是y/2。

我们要绘制一行文字时，设计必然会告诉我们0到y的距离，所以中线的位置也是固定的y/2，那么我们设置了Paint的文字大小后，Ascent和Descent又能直接得到，就可以算出中线到基线的距离，公式如下：

基线到中线的距离=(Descent+Ascent)/2-Descent

注意，实际获取到的Ascent是负数。公式推导过程如下：

中线到BOTTOM的距离是(Descent+Ascent)/2，这个距离又等于Descent+中线到基线的距离，即(Descent+Ascent)/2=基线到中线的距离+Descent。

有了基线到中线的距离，我们只要知道任何一行文字中线的位置，就可以马上得到基线的位置，从而得到Canvas的drawText方法中参数y的值。

附

Android获取中线到基线距离的代码，Paint需要设置文字大小textsize。

  /**
   * 计算绘制文字时的基线到中轴线的距离
   *
   * @param p
   * @param centerY
   * @return 基线和centerY的距离
   */
  public static float getBaseline(Paint p) {
    FontMetrics fontMetrics = p.getFontMetrics();
    return (fontMetrics.descent - fontMetrics.ascent) / 2 -fontMetrics.descent;
  }

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对我们的支持。如果你想了解更多相关内容请查看下面相关链接

赞 (0)

相关推荐

  • Android开发实现的圆角按钮、文字阴影按钮效果示例

    Android开发实现的圆角按钮、文字阴影按钮效果示例

    本文实例讲述了Android开发实现的圆角按钮.文字阴影按钮效果.分享给大家供大家参考,具体如下: 效果图: 如果要实现圆角图片,并变色须在drawable中配置背景文件如下: <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item andro

  • Android开发中TextView各种常见使用方法小结

    Android开发中TextView各种常见使用方法小结

    本文实例讲述了Android开发中TextView各种常见使用方法.分享给大家供大家参考,具体如下: 效果图: XML布局文件: <?xml version="1.0" encoding="utf-8"?> <LinearLayout android:id="@+id/root" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:

  • Android权限如何禁止以及友好提示用户开通必要权限详解

    Android权限如何禁止以及友好提示用户开通必要权限详解

    Android权限 Android安全架构规定:默认情况下,任何应用都没有权限执行对其他应用.操作系统或用户有不利影响的任何操作.这包括读写用户的私有数据(联系人,短信,相册,位置).读写其他应用的文件.执行网络访问.使设备保持唤醒状态等等. 如果是一些正常的权限(非高危权限),比如网络访问等在应用清单文件(AndroidManifest.xml)中配置,系统会自动授予, 但是如果有一些高危权限,位置,文件存储,短信等这个时候系统会要求用户授予权限,Android 发出权限请求的方式取决于系统版

  • 史上最全Android build.gradle配置详解(小结)

    Android Studio是采用gradle来构建项目的,gradle是基于groovy语言的,如果只是用它构建普通Android项目的话,是可以不去学groovy的.当我们创建一个Android项目时会包含两个Android build.gradle配置详解文件,如下图: 一.Project的build.gradle文件: 对应的build.gradle代码如下: // Top-level build file where you can add configuration options

  • android分享纯图片到QQ空间实现方式

    最新开发新项目的时候,要做分享项目,要求分享有微信,微信朋友圈,QQ,QQ空间,新浪微博这五个,所分享内容包括,分享纯图片,纯文字,图文类型等,要求分享出去的内容不能带有当前app的logo,而无论使用微信分享sdk,还是qq分享sdk,图文类型的分享都会带有当前app的logo和名称,所以笔者最终只能使用android原生实现分享功能了. 一.分享微信,分享微信单独分享一张图片时,可以使用原生分享,也可以使用微信分享sdk,sdk实现方式,笔者不再多述,网上太多,可以看官方说明: (1)  微

  • Android开发实现Switch控件修改样式功能示例【附源码下载】

    Android开发实现Switch控件修改样式功能示例【附源码下载】

    本文实例讲述了Android开发实现Switch控件修改样式功能.分享给大家供大家参考,具体如下: Android中自带的Switch控件在很多时候总觉得和整体系统风格不符,很多时候,自定义Switch是一种方法. 但其实不用这么麻烦,安卓自带的Switch通过修改一些属性,也可以达到和自定义Switch差不多的一个效果. 个人感觉,Switch的属性设置和其他控件还是有挺大区别的.因此,写下此文,方便有需要的同学参考. 先上效果图: 以上便是修改后效果 与 原生Switch的效果对比.代码在文

  • Android中Retrofit的简要介绍

    Android中Retrofit的简要介绍

    Retrofit A type-safe HTTP client for Android and Java 适用于Java和Android的安全的HTTP客户端 Retrofit是一个可用于Android和Java的网络库,使用它可以简化我们的网络操作,提高效率和正确率.它将请求过程和底层代码封装起来只暴露我们业务中的请求和返回数据模型. public interface GitHubService { @GET("users/{user}/repos") Call<List&l

  • Android开发实现的计时器功能示例

    Android开发实现的计时器功能示例

    本文实例讲述了Android开发实现的计时器功能.分享给大家供大家参考,具体如下: 效果图: 布局: 三个按钮 加上一个Chronometer <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.a

  • Android开发之ListView的简单用法及定制ListView界面操作示例

    Android开发之ListView的简单用法及定制ListView界面操作示例

    本文实例讲述了Android开发之ListView的简单用法及定制ListView界面操作.分享给大家供大家参考,具体如下: 效果: 如何从获得listview上item的内容 详见:https://www.jb51.net/article/158000.htm 中遇到的问题部分. 布局实现: 有个listview显示 一个edit和button发送 <?xml version="1.0" encoding="utf-8"?> <RelativeL

  • Android开发之获取单选与复选框的值操作示例

    Android开发之获取单选与复选框的值操作示例

    本文实例讲述了Android开发之获取单选与复选框的值操作.分享给大家供大家参考,具体如下: 效果图: 布局文件: <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/root" android:layout

随机推荐