Flutter テキストテーマを編集(Theme.of(context).textTheme.XXX)

これからも使いそうだなと思ったことを、メモ用として書きます。

記述する対象は、マテリアルデザインのテキストテーマについてです。

テキストテーマ

マテリアルデザインのテキストテーマについては、以下の記事について見てください。 https://qiita.com/kurararara/items/e452d8fd5a33ae391378

編集方法

テキストテーマを編集するには、copyWithを使えば編集できます。 ソースコードは、こんな感じです。

Theme.of(context)>textTheme.XXX.copyWith(XXX: XXX)

以下のコードを実行すると、デバイスには写真のように表示されます。

         children: <Widget>[
            Text(
              'Color is red',
              style: Theme.of(context).textTheme.headline4?.copyWith(color: Colors.red),
            ),
            Text(
              'Color is blue, size is 30',
              style: Theme.of(context).textTheme.headline4?.copyWith(fontSize: 60, color: Colors.blue),
            ),
            Text(
              'Color is red, size is 15, weight is w900',
              style: Theme.of(context).textTheme.headline4?.copyWith(fontWeight: FontWeight.w900,fontSize: 50, color: Colors.blue),
            ),
          ],