👌

Flutterのライセンスページを自作する

2 min read

FlutterにはshowLicensePage()というアプリ内で使っているライセンス情報を表示してくれる関数がある。

https://api.flutter.dev/flutter/material/showLicensePage.html

これを使うだけで良ければ問題ないが、showLicensePageで表示されるページのレイアウトを変えたいという場合は自作する必要がある。

だが自作といっても手順はそんなに難しくなく、LicenseRegistry.licenses.listen((license){})を使ってLicenseEntryというオブジェクトを取得し、適当にまとめてあとはそれを表示するだけ。

具体的には、雑だけどこんな感じ。あとはこれをNavigator.pushとかで呼べば終わり。

class MyLicensePage extends StatefulWidget {
  const MyLicensePage();

  
  _MyLicensePageState createState() => _MyLicensePageState();
}

class _MyLicensePageState extends State<MyLicensePage> {
  List<List<String>> licenses = [];

  
  void initState() {
    super.initState();
    LicenseRegistry.licenses.listen((license) {
      // license.packagesとlicense.paragraphsの返り値がIterableなのでtoList()してる
      final packages = license.packages.toList();
      final paragraphs = license.paragraphs.toList();
      final packageName = packages.map((e) => e).join('');
      final paragraphText = paragraphs.map((e) => e.text).join('\n');
      // この辺の状態更新とかは環境に合わせてお好みで
      licenses.add([packageName, paragraphText]);
      setState(() => licenses = licenses);
    });
  }

  
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView.builder(
          itemCount: licenses.length,
          itemBuilder: (context, index) {
            final license = licenses[index];
            return Padding(
              padding: const EdgeInsets.fromLTRB(10, 0, 10, 30),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    '${license[0]}',
                    style: const TextStyle(fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(height: 5),
                  Text(
                    '${license[1]}',
                    style: const TextStyle(fontSize: 12),
                  )
                ],
              ),
            );
          },
        ),
    );
  }
}

Discussion

ログインするとコメントできます