Flutter：如何修改AboutDialog的applicationName等标签文字颜色？

要修改AboutDialog中applicationName、applicationVersion和applicationLegalese的文本颜色，你可以通过在对话框外层包裹Theme组件，针对性地覆盖主题中的文本样式或颜色方案。以下是两种可行方案：

方案1：直接覆盖指定文本样式 #

AboutDialog内部的不同文本对应主题中的特定文本样式：

• applicationName 使用 headlineSmall
• applicationVersion 使用 bodyMedium
• applicationLegalese 使用 bodySmall

你可以在showDialog的builder中，用Theme组件包裹AboutDialog，并修改这些样式的颜色：

TextButton(
  onPressed: () => showDialog<String>(
    barrierColor: Colors.black,
    context: context,
    builder: (BuildContext context) => Theme(
      data: Theme.of(context).copyWith(
        textTheme: Theme.of(context).textTheme.copyWith(
          headlineSmall: const TextStyle(color: Colors.white),
          bodyMedium: const TextStyle(color: Colors.white),
          bodySmall: const TextStyle(color: Colors.white),
        ),
      ),
      child: AboutDialog(
        applicationName: '1234',
        applicationIcon: Flexible(
          child: Image.asset('assets/icon/icon.png', width: 100, height: 100),
        ),
        applicationVersion: '1234',
        applicationLegalese: '1234',
      ),
    ),
  ),
  child: const Text(
    'More Info',
    textAlign: TextAlign.center,
    maxLines: 2,
    overflow: TextOverflow.ellipsis,
    style: TextStyle(color: Colors.white),
  ),
)

方案2：修改颜色方案的onSurface属性 #

大多数文本样式默认使用colorScheme.onSurface作为文本颜色，因此你可以直接覆盖该属性，一次性修改所有相关文本的颜色：

TextButton(
  onPressed: () => showDialog<String>(
    barrierColor: Colors.black,
    context: context,
    builder: (BuildContext context) => Theme(
      data: Theme.of(context).copyWith(
        colorScheme: Theme.of(context).colorScheme.copyWith(
          onSurface: Colors.white,
        ),
      ),
      child: AboutDialog(
        applicationName: '1234',
        applicationIcon: Flexible(
          child: Image.asset('assets/icon/icon.png', width: 100, height: 100),
        ),
        applicationVersion: '1234',
        applicationLegalese: '1234',
      ),
    ),
  ),
  child: const Text(
    'More Info',
    textAlign: TextAlign.center,
    maxLines: 2,
    overflow: TextOverflow.ellipsis,
    style: TextStyle(color: Colors.white),
  ),
)

说明 #

• 方案2更简洁，利用主题的颜色关联性，无需逐个指定文本样式。
• 之前修改全局ThemeData的colorScheme无效，是因为AboutDialog继承了对话框专属的主题配置，全局修改未覆盖局部上下文。通过外层包裹Theme，可确保修改仅作用于当前AboutDialog。

内容的提问来源于stack exchange，提问作者Arnold Kumaraku