あぼぼノート

頭の中空っぽ

Flutterで1文字目だけスタイルを変える

Text.richTextSpanを使う。TextSpanで設定したstyleはchildrenに引き継がれるので、childrenのTextSpanで上書きする。

final String text = "Flutter";
Text.rich(
    TextSpan(
        text: text.substring(0, 1),
        style: TextStyle(
            fontSize: 36,
            color: Colors.blue,
            letterSpacing: 1,
        ),
        children: <TextSpan>[
            TextSpan(
                text: text.substring(1),
                style: TextStyle(
                    fontSize: 18,
                    color: Colors.black87,
                ),
            ),
        ],
    ),
),

f:id:aboy_perry:20191103183918p:plain:w300
Text.richを使って1文字目のTextStyleを変える