どうも、たくチャレ(@takuchalle)です。

アプリの開発をしていると使用しているライブラリのライセンスを表示する必要が出てきます。

Flutterでは非常に簡単にライセンス情報の表示ができます。今回はその方法を紹介します。

Flutter でのライセンス表示方法

Flutterではライセンスを表示する方法がいくつかあります。

  • showLicensePage 関数を使う
  • showAboutDialog 関数を使う
  • AboutListTitle Widget を使う
  • 自分でカスタマイズする

それぞれを順に説明していきます。一番最後にDartPadを使って実際のコードを紹介しますので、確認してみてください。実際の動きが分かると思います。

showLicensePage 関数を使う

まず showLicensePage関数の紹介をします。

使い方はすごくシンプルでcontextを渡して呼び出すだけです。

showLicensePage(context: context);

これだけで、使用しているライブラリのLICENSEファイルをまとめて1つのページとして表示してくれます。

ライセンスページにアプリの情報を表示することもできます。

showLicensePage(
    context: context,
    applicationName: 'アプリ名', // アプリの名前
    applicationVersion: '1.0.0', // バージョン
    applicationIcon: applicationIcon, // アプリのアイコン Widget
    applicationLegalese: '2020 takuchalle', // 権利情報
);

アプリのバージョンなど手動で管理すると更新漏れが必ず発生するので、package_infoパッケージを使って自動で取得する方法を後述します。

showAboutDialog 関数を使う

次にshowAboutDialog関数を紹介します。

下のようにアプリの情報を表示するダイアログが表示されて、VIEW LICENSESをタップするとライセンス情報が表示されます。

ライセンス表示部分ではshowLicensePage関数を呼び出しています。

使い方は以下の通りです。引数はshowLicensePage関数と全く同じで、context以外はオプションです。

showAboutDialog(
    context: context,
    applicationName: 'アプリ名', // アプリの名前
    applicationVersion: '1.0.0', // バージョン
    applicationIcon: applicationIcon, // アプリのアイコン Widget
    applicationLegalese: '2020 takuchalle', // 権利情報
);

AboutListTitle Widget を使う

次にAboutListTitle Widgetを紹介します。

先程紹介したshowAboutDialogListTileonTapで呼び出すようにするWidgetです。公式ドキュメントではDrawerで使うと良いと書いてあります。

AboutListTile(
    icon: const Icon(Icons.info),
    applicationName: 'アプリ名', // アプリの名前
    applicationVersion: '1.0.0', // バージョン
    applicationIcon: applicationIcon, // アプリのアイコン Widget
    applicationLegalese: '2020 takuchalle', // 権利情報
);

引数のiconListTileleadingに相当します。

こんな感じのListTileが表示されます。この場合About アプリ名と表示されていますが、日本語環境だとアプリ名についてと表示されます。

アプリの情報も合わせて表示する

今まで紹介した3つの方法では、アプリの情報も併せて表示することができます。

package_infoパッケージで、バージョンやアプリ名などの情報を取得することができるので、 次のように書けばライセンス情報とアプリの情報を併せて表示することができます。

final info = await PackageInfo.fromPlatform();
showLicensePage(
    context: context,
    applicationName: info.appName,
    applicationVersion: info.version,
    applicationIcon: applicationIcon,
    applicationLegalese: '2020 takuchalle',
);

権利情報はpackage_infoでは取得できないので、別の方法で管理してください。

ライセンスページをカスタマイズ

showLicensePage関数ではLocensePageを表示しており、デザインをカスタマイズすることができません。 アプリの世界観に合わないと思ったら、自分で作成することができます。

LicenseRegistryにライセンス情報が格納されているので、LicenseRegistry.licensesからライセンス情報を取得してアプリに合わせたライセンスページを作成することができます。LicenseRegistry.licensesStream<LicenseEntry>型になっているので、ライセンス情報が順番に流れてきます。

LicenseRegistry.licenses.listten((license)
    // ここでライセンスの処理をする
);

私もカスタマイズしたことないので、具体的にはこのコードを参考にしてみてください。

実際のコード紹介

実際のコードと動きをDartPadを使って紹介します。

上から順にshowLicensePage関数、showAboutDialog関数、AboutListTile Widgetを使っています。

DartPadの問題だと思いますが、ライセンスページでインジケーターがぐるぐるしてます。実際のアプリではここにライセンス情報が表示されます。

まとめ

Flutterでライセンス情報を表示する方法を4つ紹介しました。自身のアプリにマッチする方法を使ってライセンス情報を表示する手助けになればと思います。

公式ドキュメント