[Flutter]Columnの要素を右寄せにするには?

Flutter

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

Columnの要素を右寄せにする方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

Columnの要素を右寄せにするには、引数「crossAxisAlignment」を使います。

具体的には、Columnの引数「crossAxisAlignment」にCorssAxisAlignment.endを指定します。

Column(
  crossAxisAlignment: CrossAxisAlignment.end,
  children: [
    ・・・
  ],
),
スポンサーリンク

使用例

以下は、使用例です。

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: SizedBox(
          width: double.infinity,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              Container(
                height: 200,
                width: 200,
                color: Colors.blue,
              ),
              Container(
                height: 200,
                width: 200,
                color: Colors.green,
              ),
              Container(
                height: 200,
                width: 200,
                color: Colors.pink,
              ),
            ],
          ),
        ),
      ),
    );
  }

コメント

タイトルとURLをコピーしました