Flutter 上字体的另类玩法：FontFeature

基于网民的问题来补充扩展知识，毕竟，这方面的内容并不多。

事实上在 dart 对应可以在里面看到 FontWeight 通常被称为字体集中的字体：

因此，如果您对默认字体有疑问，可以在您的手机字体中找到是否有相应的字体，例如，尽管我们说 roboto 没有 600 ，但是如果是 roboto mono 字体集是有 600 的 fontweight，甚至还有 600 斜体： https://fonts.google.com/specimen/Roboto Mono 。

这里可以用 Android Studio 的 Device File Explorer 查看/system/etc/fonts.xml 现在手机的字体编码，右键文件 save as 在电脑上，下图是华为上的 fonts.xml 截图：

您还可以通过以下原始代码获得相应的现状 Android 字体由系统支持 Typeface ，但是这个 Typeface 不是真正的字体名，而是对应的 fonts.xml

protected Map<String, Typeface> getSSystemFontMap() { 
        
    Map<String, Typeface> sSystemFontMap = null;
    try { 
        
        //Typeface typeface = Typeface.class.newInstance();
        Typeface typeface = Typeface.create(Typeface.DEFAULT, Typeface.NORMAL);
        Field f = Typeface.class.getDeclaredField("sSystemFontMap");
        f.setAccessible(true);
        sSystemFontMap = (Map<String, Typeface>) f.get(typeface);
        for (Map.Entry<String, Typeface> entry : sSystemFontMap.entrySet()) { 
        
            Log.e("FontMap", entry.getKey() + " ---> " + entry.getValue() + "\n");
        }
    } catch (Exception e) { 
        
        e.printStackTrace();
    }
    return sSystemFontMap;
}

private static List<String> getKeyWithValue(Map map, Typeface value) { 
        
    Set set = map.entrySet();
    List<String> arr = new ArrayList<>();
    for (Object obj : set) { 
        
        Map.Entry entry = (Map.Entry) obj;
        if (entry.getValue().equals(value)) { 
        
            String str = (String) entry.getKey();
            arr.add(str);
        }
    }
    return arr;
}

例如前面我们说过 Roboto 没有 w600 , 但是通过输出比对，华为上有 source-sans-pro 是支持 w600 ：

另外注意这是 Flutter 而不是原生，具体实现调用是在 Engine 的 paragraph_skia.cc 和 paragraph_builder_skia.cc 下对应的 setFontFamilies 相关逻辑，当然默认字体库指定在 typography.dart 下就看到，例如 'Roboto' 、 '.SF UI Display' 、'.SF UI Text' 、'.AppleSystemUIFont' 、 'Segoe UI' ：

例如：.SF Text 适用于更小的字体；.SF Display 则适用于偏大的字体，我记得分水岭好像是 20pt 左右，不过 SF（San Francisco） 属于动态字体，系统会动态匹配。

另外如果你在 Mac 的 Web 上使用 Flutter Web，可以看到指定的是 .AppleSystemUIFont ，而对于 .AppleSystemUIFont 它其实不算是一种字体，而是苹果上字体的一种集合别称：

还有，如果你去看 Flutter 默认自带的 cupertino/context_menu_action.dart ，就可以看到一个有趣的情况：

为了强调和 iOS 上的样式尽量一直，当开发者配置 isDefaultAction == true 时，会强行指定 '.SF UI Text' 并指定为 FontWeight.w600。

当然，前面我们说了那么多，主要是针对英文的情况下，而在中文下还是有差异的，之前的文章也介绍过：

• 默认在 iOS 上：

  • 中文字体：PingFang SC
  • 英文字体：.SF UI Text 、.SF UI Display

• 默认在 Android 上：

  • 中文字体：Source Han Sans / Noto
  • 英文字体：Roboto

例如，在苹果上的简体中文其实会是 PingFang SC 字体，对应还有PingFang TC 和 PingFang HK 的繁体集，而关于这个问题在 Flutter 上之前还出现过比较有意思的 bug ：

用户在输入拼音时，iOS 会在中文拼音之间添加额外的 unicode \u2006 字符，比如输入 "nihao" ，iOS 系统会在 skia 中添加文字 “ni\u2006hao ”，从而导致字体无效的情况。

当然后续的 #16709 修复了这个问题 ，而在以前的文章我也讲过，当时我遇到了 “Flutter 在 iOS 系统上，系统语言是韩文时，在和中文一起出现会导致字体显示异常" 的问题 ：

解决方法也很简单，就是给 fontFamilyFallback 配置上 ["PingFang SC" , "Heiti SC"] 就可以了，这是因为韩文在苹果手机上使用的应该是 Apple SD Gothic Neo 这样的超集字体库，【广】这个字符在这个字体集上是不存在的，所以就变成了中文的【广】；

所以可以看到，字体相关是一个平时很少会深入接触的东西，但是一旦涉及多语言和绘制，就很容易碰到问题的领域。