[Flutter]Text(テキスト)の位置(position)を調整(alignment)するには？

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

Textの位置を調整する方法を紹介します。

方法
1. Align
2. Container
まとめ

方法

Textの位置を調整する方法は２つあります。

Align

１つは、Alignを使う方法です。

まず、TextをAlignでラップします。

そして、Alignの引数「alignment」に位置を指定します。

Align(
  alignment: /*位置*/,
  child: Text(
    'テキスト',
  ),
),

位置の指定は、Alignmentクラスで指定します。

使用例

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Align(
        alignment: Alignment.center, //真ん中
        child: Text(
          'Hello Flutter',
        ),
      ),
    );
  }

Container

もう１つは、Containerを使う方法です。

まず、TextをContainerでラップします。

そして、Containerの引数「alignment」に位置を指定します。

Container(
  alignment: /*位置*/,
  child: Text(
    'テキスト',
  ),
),

Containerの引数「alignment」への位置の指定は、Alignmentクラスを使います。

使用例

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        alignment: Alignment.centerLeft, //中央左
        child: Text(
          'Hello Flutter',
        ),
      ),
    );
  }