flutter - 如何在 Flutter 中为整个应用设置 letterSpacing？

Question

我正在使用 Flutter，我知道letterSpacing属性对于在字母之间提供一些间距很有用。

我想将它提供给整个应用程序，我的意思是我在应用程序中编写任何文本的任何地方。我想为所有文本设置 1.0 字母间距。

有什么办法吗？

Answer 1

您可以在 constants.dart 文件中定义一个 const DEF_TEXT_STYLE，然后在需要时应用它。

常量.dart

const DEF_TEXT_STYLE = const TextStyle(
    letterSpacing: 1.0);

你可以这样申请：

Text(
   'This is my text',
    style: DEF_TEXT_STYLE,
),

请记住导入您的 constants.dart 文件。

否则，您可以覆盖所有 textTheme 数据，类似于@glavigno 所说的：

在这里你可以看到 Flutter 中所有可用的 textTheme 数据。 文档

theme: ThemeData(
        textTheme: TextTheme(
          headline1: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          headline2: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          headline3: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          headline4: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          headline5: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          headline6: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          subtitle1: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          subtitle2: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          bodyText1: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          bodyText2: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          button: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          caption: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          overline: Theme.of(context)
              .textTheme
              .headline1
              .copyWith(letterSpacing: 1.0),
          
        ),
      ),

Answer 2

您可以定义一个 TextTheme 并为每种类型的文本（headline1，...）设置自定义 TextStyle。

如果没有提供主题，Flutter 会为您定义一个默认主题。

但是，您可以覆盖或扩展默认值并定义 letterSpacing 属性。我在下面展示了标题 1 和按钮的示例。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        textTheme: TextTheme(
          headline1: Theme.of(context)
              .textTheme
              .bodyText1
              .copyWith(letterSpacing: 1.0),
          button: Theme.of(context)
              .textTheme
              .button
              .copyWith(letterSpacing: 1.0),
        ),
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}