iOS 上利用 fallback 机制为不同语言的文字 设定字体,从而使得文本混排更为优雅

如果您是一位 WEB 开发者,相信您对 CSS 的font-family属性一定不会陌生。通常我们会为font-family属性设置一长串的字体(家族)列表,就像这样的:

有人肯定会问,为什么要这么设置啊?如果你足够细心,你一定会发现当你浏览该网页时英文字体和中文字体并不是同一种字体,如果你在不同的操作系统甚至不同的电脑上看到网页所呈现的字体也不一样。这又是为什么呢?

此外,在您使用 Microsoft Word 进行段落排版的时候,你会发现 Word 可以自动对中文样式应用中文字体,对英文样式应用英文字体。这又是如何做到的呢?

在实际的排版需求中,为了好看,我们通常会需要针对不同语言的文字 (script) 进行不同的字体设定,以达到最佳的视觉效果。当然,对于我们来说,最常见的还是中英文混排。通常设计人员给出的设计稿非常漂亮,可是中英文使用了不同的字体,我们开发人员该如何高保真地还原设计稿的原始设计呢?

很显然,对于 WEB 开发者来说,已经有了很好的解决方案,而对于其他客户端的同学来说,这估计应该就有点犯难了,我们通常会告诉设计人员:“系统不支持”抑或“做不了”之类的话。那事实上,到底能不能做到呢?答案是肯定的。

要实现这个,我们先来了解一个概念:fallback 机制。

这种机制通常是首先规定拉丁字母、西里尔字母、希腊字母等西文的字体,然后以一定的顺序分别规定阿拉伯字母、天城文(例如印度文)、日文、韩文、简体中文、繁体中文等文字的字体。文本引擎会尽量用优先的字体来显示当前遇到的字符,如果 fallback 列表中最靠前的字体不支持此字符,就向后找(这就是所谓 fallback)。CSS 的font-family属性基本也是这样工作的。

Windows 其实也是类似这样的。目前 Windows 7 的西文字体是 Segoe UI,简体中文字体是微软雅黑,繁体中文字体是微软正黑,日文字体是 Meiryo,天城文字体是 Mangal…… 所以你根本不需要这样的软件,你的操作系统已经是这样了。

因为中日韩汉字共享 Unicode code point,所以当一个字(比如「直」这个字)同时受到简体中文、繁体中文、日文、韩文字体的支持,操作系统会根据当前的 locale 以及系统语言列表的顺序选择最优先的书写系统的字体。

然而,很少谈及移动操作系统上的字体 fallback 机制,更别说实现了,还好我经过不断查找,找到一些蛛丝马迹。由于本人是一名 iOS 开发者,所以我们以 iOS 为例,来看看它的实现方式。

通常,我们使用如下的方式创建一个字体:

显然,如果您还这样创建,肯定无法实现我们的目标。那应该怎么做呢?我们需要使用到UIFontDescriptor,代码如下:

调用示例:

其中 family 和 font name 这两个别搞混了,不知道怎么在 iOS 上看字体的 family 和 font name 的可以在 AppStore 下载这个 App:字体预览(Font Preview)

如果是自定义字体,也可以在同一个wifi的局域网中将字体上传到 App 里查看。

演示动画:

代码已经开源,Github地址:

https://github.com/pcjbird/fbCharm

参考链接:

是否有一种软件能够对不同语言的文字指定不同的字体?

https://www.zhihu.com/question/20127442/answer/14064802

Fallback to pure Japanese font. No more Chinese font in Japanese text on iOS apps.

https://github.com/usagimaru/FallbackToJapaneseSystemFont

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20181216G0YP3D00?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 yunjia_community@tencent.com 删除。

扫码关注云+社区

领取腾讯云代金券