[Flutter]共通(default)のTextStyle(テキストスタイル)を設定するには？

どうも、ちょげ(@chogetarou)です。

共通のTextStyleを設定する方法を紹介します。

方法
使用例

方法

共通のTextStyleを設定するには、DefaultTextStyleウェジェットを使います。

まず、共通のTextStyleを持たせたいTextをDefaultTextの下の階層になるようにします。

そして、DefaultTextStyleの引数「style」に共通で設定するTextStyleを指定します。

DefaultTextStyle(
  style: TextStyle(
    ・・・
  ),
  child: Center(
    child: Column(
      children: [
        Text('テキスト１'),
        Text('テキスト２'),
        Text('テキスト３'),
        Text('テキスト４'),
         ・・・
      ],
    ),
  ),
),

DefaultTextStyleを使えば、Textに共通のTextStyleを設定することが出来ます。

Text自体でTextSytleを設定した場合は、Textに設定されたTextStyleが優先されます。

使用例

以下は、使用例です。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: DefaultTextStyle(
        style: TextStyle(
          color: Colors.red,
          fontSize: 24,
        ),
        child: Center(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('Hello'),
              Text('Flutter'),
              Text('こんにちは'),
              Text('フラッター'),
            ],
          ),
        ),
      ),
    );
  }