Slackコミュニティに

無料で参加する

Flutterラボの

プレミアム会員になる

【Flutter】指定した範囲のTextStyleを一括変更する

2021.11.02

表示する文字のスタイルはTextウィジェトのstyleプロパティにTextStyleを指定することで変更することができますが、同じようなテキストスタイルをたくさんコピーして書いている方も多いと思います。

ColumnやRowの中にあるTextだけに共通したTextStyleにしたいケースは多々あると思うのでその方法を紹介したいと思います。

child: DefaultTextStyle.merge(
  style: const TextStyle(color: Colors.red, fontSize: 20),
  child: Column(
    children: const [
      Text('ホーム'),
      Text('事業内容'),
      Text('製品情報'),
      Text('お問い合わせ'),
      Text('会社概要'),
    ],
  ),
),

このように、DefaultTextStyle.mergeでColumnを囲い、styleを指定すればColumn内のすべてのTextにstyleが適用されます。

Flutterラボ|動画で学ぶFlutter学習サイト Flutter・Dart・Firebaseに関するアプリ制作の技術を学ぶことができます。プログラミング初心者から経験者まで flutterlabo.tech


Flutterラボ
hatchoutschool
FlutterとNuxtに関する知識を発信しています! 動画で学べる学習サイト『Flutterラボ』と『Nuxtラボ』を運営 Flutterラボ:https://flutterlabo.tech/