如何展示About Dialog？使用该Flutter组件遇报错求助

一、如何展示About Dialog？ #

有两种实用的方式可以展示About Dialog，适配不同的场景：

方式1：用AboutListTile（推荐，贴合Material Design规范） #

AboutListTile是Material组件库专门提供的触发About Dialog的列表项，它会自动处理点击弹窗的逻辑，不用自己写额外的触发代码：

Scaffold(
  appBar: AppBar(title: const Text('Demo App')),
  drawer: Drawer(
    child: ListView(
      children: const [
        AboutListTile(
          icon: Icon(Icons.info_outline),
          applicationName: '我的Flutter应用',
          applicationVersion: 'v1.0.0',
          applicationIcon: Icon(Icons.flutter_dash, size: 48),
          applicationLegalese: '© 2024 版权所有',
        ),
      ],
    ),
  ),
);

点击这个列表项，标准的About Dialog就会自动弹出来。

方式2：手动通过showDialog包裹AboutDialog #

如果需要自定义触发时机（比如点击某个按钮），可以直接用showDialog来手动唤起：

ElevatedButton(
  onPressed: () {
    showDialog(
      context: context,
      builder: (context) => const AboutDialog(
        applicationName: '我的Flutter应用',
        applicationVersion: 'v1.0.0',
        applicationIcon: Icon(Icons.flutter_dash, size: 48),
        applicationLegalese: '© 2024 版权所有',
      ),
    );
  },
  child: const Text('查看关于'),
);

二、关于name字段报错的问题 #

你遇到的name字段报错，几乎可以肯定是Flutter的API版本差异导致的——当前版本的AboutDialog已经移除了name参数，取而代之的是applicationName来指定应用名称。

你只需要把代码里的name替换成applicationName，报错应该就能解决。举个对比例子：

// 旧API写法（现在会报错）
AboutDialog(name: '我的应用')

// 当前正确写法
const AboutDialog(applicationName: '我的应用')

如果是跟着较早的视频教程学习，建议同步参考Flutter官方的最新文档，避免版本差异带来的这类问题~

内容的提问来源于stack exchange，提问作者Harith AL Any