面试题：Flutter中如何通过主题定制Text Widget的默认样式

Question

在Flutter开发中，阐述如何利用主题（Theme）来统一设置Text Widget的字体大小、颜色、字体样式等默认样式。请详细说明在主题中配置相关属性的方法以及在Text Widget中应用这些配置的方式。

Answer 1

1. 在主题中配置Text相关属性：
   • 在Flutter中，通过ThemeData来配置应用的主题。对于Text的样式，可以在ThemeData的textTheme属性中进行设置。textTheme是TextTheme类型，它包含了不同级别的文本样式，如displayLarge、headlineMedium、bodySmall等。
   • 例如，要设置默认的字体大小、颜色和字体样式：

   ThemeData theme = ThemeData(
     textTheme: TextTheme(
       bodyMedium: TextStyle(
         fontSize: 16.0,
         color: Colors.black,
         fontStyle: FontStyle.normal,
       ),
     ),
   );
   

   • 这里设置了bodyMedium级别的文本样式，字体大小为16.0，颜色为黑色，字体样式为正常。你还可以对其他如displayLarge等不同级别的文本样式进行类似设置。
2. 在Text Widget中应用配置：
   • 当在主题中配置好TextTheme后，在Text组件中可以直接使用。如果没有在Text组件中显式设置样式，它会自动使用主题中对应的TextTheme样式。
   • 例如：

   Scaffold(
     body: Center(
       child: Text('This is a sample text'),
     ),
   );
   

   • 上述Text组件会使用主题中textTheme里bodyMedium（如果没有特别指定，Text默认使用bodyMedium样式）的样式设置，即字体大小16.0，颜色黑色，字体样式正常。如果想使用其他级别的样式，可以在Text组件中指定：

   Scaffold(
     body: Center(
       child: Text(
         'This is a sample text',
         style: Theme.of(context).textTheme.displayLarge,
       ),
     ),
   );
   

   • 这里通过Theme.of(context).textTheme.displayLarge获取主题中displayLarge级别的文本样式并应用到Text组件上。