周末在家帮表妹修手机,苹果她突然问我:"哥,手机我把字体调大了之后淘宝的字体按钮就叠在一起了,你们做开发的样式应用能不能长点心?"这话让我老脸一红,赶紧打开Xcode查代码。调整今天就聊聊我们程序员在字体适配这事儿上踩过的后何坑。

一、保持系统字体怎么把App搞懵的兼容

去年公司App收到条一星评价:"打开就像老年机!"原来用户把系统字体调到了最小。苹果我们的手机设计师是按默认尺寸做的界面,字小了按钮留白多得像空旷的字体广场。

  • 在表格添加结构化数据 -->
  • 设备默认字体最大字体文字溢出率
    iPhone 1217pt35pt68%
    iPhone SE17pt35pt92%

    1. 动态字体那些事儿

    记得第一次用UIFontMetrics的样式应用时候,我在代码里写了这么段:

    • let font = UIFontMetrics.default.scaledFont(for: customFont)
    • label.adjustsFontForContentSizeCategory = true

    结果测试妹子反馈说有些页面字会"撑破"单元格。调整后来才发现忘了设置lineBreakMode,后何长文本直接冲破了布局防线。保持

    二、开发者的字体求生指南

    上周隔壁组因为字体适配问题延期上线,CTO在晨会上拍桌子:"以后谁再用固定字号,就去帮客服接电话!"

    2. 自动布局的魔法

    有次我在登录页面用了UIStackView,配合这些设置才让布局稳如老狗:

    • 垂直间距设置≥8pt
    • 图片资源提供@2x和@3x版本
    • 约束优先级调整到750

  • 在表格添加结构化数据 -->
  • 适配方式兼容性维护成本
    Auto Layout★★★★☆中等
    手动计算★★☆☆☆

    三、测试员的秘密武器

    测试组老张有台专门用来"找茬"的iPhone,系统设置里存着5套极端字体配置。他们组流传着这样的段子:"能在老张手机里活过3分钟的App,上线绝对稳。"

    3. 模拟器实战技巧

    在Xcode里按Command+Shift+A调出辅助功能检查器,这几个参数必测:

    • 粗体文本开关
    • 透明度降低模式
    • 深色/浅色模式切换

    (本文部分实践参考了《iOS Human Interface Guidelines》和《Dynamic Type in Practice》中的方法论)

    窗外的知了还在叫,表妹发来消息说淘宝更新后字体问题好了很多。我放下咖啡杯,在键盘上敲下第1024次字体适配的代码——这次应该能让用户少骂两句了吧。