Flutter 应用的默认字体系列是什么？答案

【问题标题】：What is the default font family of a Flutter app?Flutter 应用的默认字体系列是什么？
【发布时间】：2019-03-22 10:39:48
【问题描述】：

我如何检索 Flutter 应用的当前字体系列名称以及默认字体名称是什么？

我试过了

Theme.of(context).textTheme.

和

Theme.of(context).

但字体系列没有属性。

【问题讨论】：

标签： flutter dart fonts

【解决方案1】：

Flutter 应用项目的默认字体系列是

Roboto - 在这里获取：https://fonts.google.com/specimen/Roboto#standard-styles

默认显示在 Andriod OS 上。

对于 iOS 设备

旧金山字体 - 在这里获取：https://developer.apple.com/fonts/

要在你的 Flutter 项目中默认使用它们中的任何一个（也取决于你的主题设置），你可以导入其中一个或两个：

对于安卓 - import package:flutter/material.dart.

对于 iOS - import package:flutter/cupertino.dart。

您也可以使用其他字体（将其文件夹添加到根文件夹或创建资产文件夹）并将字体定义包含在 pubspec.yaml 中

【讨论】：

【解决方案2】：

默认字体取决于操作系统：

Android 使用 Roboto 字体。
iOS 使用 San Francisco 字体（特别是 SF Pro Display）。

【讨论】：

【解决方案3】：

MaterialApp的默认字体在

/flutter/packages/flutter/lib/src/material/typography.dart

在 iOS 上，默认的 TextTheme 是

  static const TextTheme whiteCupertino = TextTheme(
    display4   : TextStyle(debugLabel: 'whiteCupertino display4',   fontFamily: '.SF UI Display', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display3   : TextStyle(debugLabel: 'whiteCupertino display3',   fontFamily: '.SF UI Display', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display2   : TextStyle(debugLabel: 'whiteCupertino display2',   fontFamily: '.SF UI Display', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display1   : TextStyle(debugLabel: 'whiteCupertino display1',   fontFamily: '.SF UI Display', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    headline   : TextStyle(debugLabel: 'whiteCupertino headline',   fontFamily: '.SF UI Display', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    title      : TextStyle(debugLabel: 'whiteCupertino title',      fontFamily: '.SF UI Display', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    subhead    : TextStyle(debugLabel: 'whiteCupertino subhead',    fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    body2      : TextStyle(debugLabel: 'whiteCupertino body2',      fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    body1      : TextStyle(debugLabel: 'whiteCupertino body1',      fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    caption    : TextStyle(debugLabel: 'whiteCupertino caption',    fontFamily: '.SF UI Text',    inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    button     : TextStyle(debugLabel: 'whiteCupertino button',     fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    subtitle   : TextStyle(debugLabel: 'whiteCupertino subtitle',   fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    overline   : TextStyle(debugLabel: 'whiteCupertino overline',   fontFamily: '.SF UI Text',    inherit: true, color: Colors.white,   decoration: TextDecoration.none),
  );

在 Android 上，默认的 TextTheme 是

 static const TextTheme whiteMountainView = TextTheme(
    display4   : TextStyle(debugLabel: 'whiteMountainView display4',   fontFamily: 'Roboto', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display3   : TextStyle(debugLabel: 'whiteMountainView display3',   fontFamily: 'Roboto', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display2   : TextStyle(debugLabel: 'whiteMountainView display2',   fontFamily: 'Roboto', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    display1   : TextStyle(debugLabel: 'whiteMountainView display1',   fontFamily: 'Roboto', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    headline   : TextStyle(debugLabel: 'whiteMountainView headline',   fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    title      : TextStyle(debugLabel: 'whiteMountainView title',      fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    subhead    : TextStyle(debugLabel: 'whiteMountainView subhead',    fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    body2      : TextStyle(debugLabel: 'whiteMountainView body2',      fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    body1      : TextStyle(debugLabel: 'whiteMountainView body1',      fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    caption    : TextStyle(debugLabel: 'whiteMountainView caption',    fontFamily: 'Roboto', inherit: true, color: Colors.white70, decoration: TextDecoration.none),
    button     : TextStyle(debugLabel: 'whiteMountainView button',     fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    subtitle   : TextStyle(debugLabel: 'whiteMountainView subtitle',   fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
    overline   : TextStyle(debugLabel: 'whiteMountainView overline',   fontFamily: 'Roboto', inherit: true, color: Colors.white,   decoration: TextDecoration.none),
  );

您可以通过以下代码检索字体系列

DefaultTextStyle.of(context).style.fontFamily

【讨论】：

如何在iOS平台上使用字体AvenirNext？ iOS 支持此字体，但我需要在 assets 中声明吗？
@Shinichi 您不必在资产中声明“AvenirNext”字体，只需在代码中使用 TextStyle(fontFamily: 'Avenir Next')。
为什么DefaultTextStyle.of(context).style.fontFamily 在 iPhone 8 模拟器上返回 monospace...
可以在Android上使用SF UI Display吗？我尝试为我的 Android 手机指定 fontFamily: '.SF UI Display' 但它似乎不起作用。
@scottlee SF UI 仅安装在 iOS 上，Android 无法使用。

【解决方案4】：

MaterialApp 的默认字体是roboto，一种谷歌字体。

https://fonts.google.com/specimen/Roboto

【讨论】：