前语

通常咱们在App中会运用第三方的开源代码，按照许可协议，咱们应该在App中揭露运用的开源代码而且附上对应的开源协议。当然，实际上只需少部分注重合规性的大厂才会这么干，比如下图是支付宝的关于界面的第三方信息。当然，关于小企业，基本上都不会放运用的第三方开源代码的任何信息。

像支付宝那样“致敬”第三方开源代码

不过，作为一个有“追求”的码农，咱们仍是想对开源软件问候一下的，毕竟，没有他们我都不知道怎样写代码。可是，咱们的 App 里用了那么多第三方开源插件，总不能一个个找出来逐个问候吧？怎样办？其实，Flutter 早就为咱们准备好了一个组件，那就是本篇要介绍的 AboutDialog。

AboutDialog 简介

AboutDialog 是一个对话框，它能够供给 App 的基本信息，如 Icon、版别、App 称号、版权信息等。

像支付宝那样“致敬”第三方开源代码

一起，AboutDialog还供给了一个检查授权信息（View Licenses）的按钮，点击就能够检查 App 里一切用到的第三方开源插件，而且会自动收集他们的 License 信息展现。所以，运用 AboutDialog 能够让咱们轻松表达敬意。怎样运用呢？十分简略，咱们点击一个按钮的时分，调用 showAboutDialog 就搞定了，比如下面的代码：

IconButton(
  onPressed: () {
    showAboutDialog(
      context: context,
      applicationName: '岛上码农',
      applicationVersion: '1.0.0',
      applicationIcon: Image.asset('images/logo.png'),
      applicationLegalese: '2023 岛上码农版权一切'
    );
  },
  icon: const Icon(
    Icons.info_outline,
    color: Colors.white,
  ),
),

参数其实一目了然，详细如下：

  • context：当时的 context；
  • applicationName：运用称号；
  • applicationVersion：运用版别，假如要自动获取版别号也能够运用 package_info_plus 插件。
  • applicationIcon：运用图标，能够是任意的 Widget，通常会是一个App 图标图片。
  • applicationLegalese：其他信息，通常会放置运用的版权信息。

点击按钮，就能够看到相应的授权信息了，点击一项就能够检查详细的 License。我看了一下运用的开源插件十分多，要是自己处理还真的很费事。

像支付宝那样“致敬”第三方开源代码

能够说十分简略，当然，假如你直接运行还有两个小问题。

按钮本地化

AboutDialog 默许供给了两个按钮，一个是检查授权信息，一个是封闭，可是两个按钮 的标题默许是英文的（分别是VIEW LICENSES和 CLOSE）。

像支付宝那样“致敬”第三方开源代码

假如要改成本地话的，还需要做一个自界说配置。咱们扒一下 AboutDialog 的源码，会发现两个按钮在DefaultMaterialLocalizations中界说，分别是viewLicensesButtonLabel和closeButtonLabel。这个时分咱们自界说一个类集成DefaultMaterialLocalizations就能够了。

class MyMaterialLocalizationsDelegate
    extends LocalizationsDelegate<MaterialLocalizations> {
  const MyMaterialLocalizationsDelegate();
  @override
  bool isSupported(Locale locale) => true;
  @override
  Future<MaterialLocalizations> load(Locale locale) async {
    final myTranslations = MyMaterialLocalizations(); // 自界说的本地化资源类
    return Future.value(myTranslations);
  }
  @override
  bool shouldReload(
          covariant LocalizationsDelegate<MaterialLocalizations> old) =>
      false;
}
class MyMaterialLocalizations extends DefaultMaterialLocalizations {
  @override
  String get viewLicensesButtonLabel => '检查版权信息';
  @override
  String get closeButtonLabel => '封闭';
}

然后在 MaterialApp 里指定本地化localizationsDelegates参数运用自界说的委托类目标就能完结AboutDialog两个按钮文字的替换。

return MaterialApp(
  debugShowCheckedModeBanner: false,
  title: 'Flutter Demo',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: const AboutDialogDemo(),
  localizationsDelegates: const [MyMaterialLocalizationsDelegate()],
);

增加自界说的授权信息

尽管 Flutter 会自动收集第三方插件，可是假如咱们自己运用了其他第三方的插件的话，比如没有在 pub.yaml 里引进，而是直接运用了源码。那么仍是需要手动增加一些授权信息的，这个时分咱们需要自己手动增加了。增加的办法也不费事，Flutter 供给了一个LicenseRegistry的东西类，能够调用其 addLicense 办法来帮咱们增加授权信息。详细运用如下：

LicenseRegistry.addLicense(() async* {
  yield const LicenseEntryWithLineBreaks(
    ['关于岛上码农'],
    '我是岛上码农，微信大众号同名。\f如有问题能够加自己微信沟通，微信号：island-coder。',
  );
});

这个办法能够在main办法里调用。其中第一个参数是一个数组，是因为能够答应多个开源代码共用一份授权信息。一起，假如一份开源插件有多个授权信息，能够多次增加，只需称号一致，Flutter就会自动合并，而且会显现该插件的授权信息条数，点击检查时，会将多条授权信息运用分割线分隔，代码如下所示：

void main() {
  runApp(const MyApp());
  LicenseRegistry.addLicense(() async* {
    yield const LicenseEntryWithLineBreaks(
      ['关于岛上码农'],
      '我是岛上码农，微信大众号同名。如有问题能够加自己微信沟通，微信号：island-coder。',
    );
  });
  LicenseRegistry.addLicense(() async* {
    yield const LicenseEntryWithLineBreaks(
      ['关于岛上码农'],
      '运用时请注明来自岛上码农、。',
    );
  });
}

像支付宝那样“致敬”第三方开源代码

总结

本篇介绍了在 Flutter 中快速展现授权信息的办法，经过 AboutDialog 就能够轻松搞定，各位“抄代码”的码农们，赶忙用起来向大牛们问候吧！

我是岛上码农，微信大众号同名。如有问题能够加自己微信沟通，微信号：island-coder。

：觉得有收获请点个赞鼓舞一下！

：收藏文章，便利回看哦！

：评论沟通，互相进步！