字体渲染

字体渲染

位图字体(Bitmap Font)

最简单的文本渲染方式是:点阵字体 (Dot-matrix-fonts) 也叫位图字体 (Bitmap-fonts),即将用到的字符,预先输出到一张贴图中,使用的时候再找到对应的字符的 UV,再绘制文本。

这种方法的缺点很明显:字符集、字体的样式、字号等,在输出完贴图后就固定了。

矢量字体 (Vector Font)

矢量字体(Vector font)中每一个字形是通过数学曲线来描述的,它包含了字形边界上的关键点,连线的导数信息等,字体的渲染引擎通过读取这些数学矢量,然后进行一定的数学运算来进行渲染。这类字体的优点是字体实际尺寸可以任意缩放而不变形、变色。

字体文件中存放的是每个字符绘制的样条曲线控制点,可以使用 Glyph Inspector (在线字形查看器) 来查看对应字体文件中字符的信息:

不同字号,斜体、粗体的字模光栅化后都会存储在字体贴图中,其原理大致跟 Bitmap Font 类似,只是字符的贴图是通过加载矢量字体,动态增加到贴图中。

字体格式类型主要有几个大分类:TrueType、Embedded Open Type 、OpenType、WOFF 、SVG。

TTF:TrueType

TTF文件基于TrueType规范字体技术。早些时候,它是由Apple Computer,Inc for Mac OS发起的,后来是由Microsoft Windows操作系统采用的。

TrueType字体可在打印机和计算机屏幕上提供最佳的质量显示,而没有任何分辨率。所有最近的应用程序都可以使用TTF文件来处理字体。 TTF字体文件是不含成本的,可以通过Internet获得。

它是Windows和Mac系统最常用的字体格式,其最大的特点就是它是由一种数学模式来进行定义的基于轮廓技术的字体,这使得它们比基于矢量的字体更容易处理,保证了屏幕与打印输出的一致性。同时,这类字体和矢量字体一样可以随意缩放、旋转而不必担心会出现锯齿。

EOT :Embedded Open Type

EOT文件格式包含一个单个嵌入式结构,该结构可以表示有关字体名称和支持字符的足够基本信息。此信息的包装迫使用户代理避免解压缩,解开包装或安装字体,如果它已经在计算机上安装。这些字体广泛用于网页。它是由Microsoft开发的,并得到其产品的支持,例如PowerPoint演示文稿.pps文件。

OTF:OpenType

OTF文件称为OpenType字体格式。 OTF字体格式扩展了TTF格式的现有特征,并且比TTF更可具扩展性。它是由Adobe和Microsoft开发的。

OTF结合了TrueType字体格式和PostScript的功能,这使OTF格式义务了多数写作系统和无关。

OpenType字体格式由Windows 2000或更高版本和Mac OS X支持。

WOFF:Web Open Font Format

WOFF字体格式压缩与字体数据相关的基于表的SFNT结构,这些结构用于各种字体类型,例如Opentype或TrueType格式。它充当各种字体类型的容器,可以构成字体的元数据和私人数据。 SFNT文件被转换器转换为沃夫格式的文件,用户代理恢复了可与Web文档一起使用的编码文件。请注意,恢复的字体数据与输入字体格式完全匹配而不会丢失任何方面。

SVG:Scalable Vector Graphics

SVG是由W3C制定的开放标准的图形格式。SVG字体就是使用SVG技术来呈现字体,还有使用gzip压缩格式的SVG字体。

特别的TTC格式字体

TTC字体是TrueType字体集成文件(.TTC文件),是在一单独文件结构中包含多种字体,以便更有效地共享轮廓数据,当多种字体共享同一笔画时,TTC技术可有效地减小字体文件的大小。

TTC是几个TTF合成的字库,安装后字体列表中会看到两个以上的字体。两个字体中大部分字都一样时,可以将两种字体做成一个TTC文件,常见的TTC字体,因为共享笔划数据,所以大多这个集合中的字体区别只是字符宽度不一样,以便适应不同的版面排版要求。

SDF Font

所谓的SDF就是 Signed Distance Field 的缩写,它是一种算法,翻译成中文叫做:有向距离场算法

该算法,由 Valve 的 Chris Green 在 SIGGRAPH 2007 论文:《Improved Alpha-Tested Magnification for Vector Textures and Special Effects》 当中提出。当时主要用于渲染图片,之后被广泛的运用于其他技术领域中,字体渲染,只是其中之一。

相比原本的 ttf 字体,使用了 SDF 的文本,在任意距离、缩放尺寸下,都能渲染出清晰的文本,而 ttf 则可能出现毛边,失真的情况。

SDF也需要贴图,但是,它里面存储的不再是像素数据,而是存储每一个点到边缘的距离:

场中每个坐标对应一个到物体表面的最近距离,如果坐标点在物体内部则距离为负。

SDF的贴图,可以实时生成,也可以离线生成。

SDF 生成算法

  • 欧几里得距离转换 (Euclidean Distance Transform, EDT)
  • 8点有向按序欧几里得距离转换 (8-point Signed Sequential Euclidean Distance Transform, 8SSEDT)
  • 4SSEDT
  • Chamfer3x3 DT
  • Dead Reckoning

目前 8SSEDT (8-points Signed Sequential Euclidean Distance Transform) 算法是比较流行的解法。

参考资料

相关推荐
盼海22 分钟前
排序算法(五)--归并排序
数据结构·算法·排序算法
网易独家音乐人Mike Zhou4 小时前
【卡尔曼滤波】数据预测Prediction观测器的理论推导及应用 C语言、Python实现(Kalman Filter)
c语言·python·单片机·物联网·算法·嵌入式·iot
Swift社区7 小时前
LeetCode - #139 单词拆分
算法·leetcode·职场和发展
Kent_J_Truman8 小时前
greater<>() 、less<>()及运算符 < 重载在排序和堆中的使用
算法
IT 青年8 小时前
数据结构 (1)基本概念和术语
数据结构·算法
Dong雨9 小时前
力扣hot100-->栈/单调栈
算法·leetcode·职场和发展
SoraLuna9 小时前
「Mac玩转仓颉内测版24」基础篇4 - 浮点类型详解
开发语言·算法·macos·cangjie
liujjjiyun9 小时前
小R的随机播放顺序
数据结构·c++·算法
¥ 多多¥9 小时前
c++中mystring运算符重载
开发语言·c++·算法
trueEve10 小时前
SQL,力扣题目1369,获取最近第二次的活动
算法·leetcode·职场和发展