テキストを全幅ボタン、つまりwidth: double.infinity
を持つボタンに揃えることができるかどうかを把握しよう
例えばこれ:
ButtonTheme(
minWidth: double.infinity,
child: FlatButton(
onPressed: () {},
child: Text('Sign Out', textAlign: TextAlign.left),
),
)
中央揃えのテキストボタンを生成し、配置を変更することはできません。
いくつか試してみましたが、カスタムボタンを作成しない限り、理解できません。
ユーザーが行のどこでもクリックできるようにtext:leftの全幅ボタンを取得しようとしていますが、それでも素材のタップ効果を取得できます。
RawMaterialButton
のbuild-Methodの子は 常に中央揃え であることがわかりました。
child: Center(
widthFactor: 1.0,
heightFactor: 1.0,
child: widget.child,
),
テキストを開始/左に揃えるようにするには、テキストを無限大にして、親ウィジェットであるCenterウィジェットと同じ幅にします。
child: FlatButton(
child: SizedBox(
width: double.infinity,
child: Text(
'Sign out',
textAlign: TextAlign.left,
),
),
onPressed: () {},
);
もう1つの単純なハックは、1つの要素のみを持つRow内にボタンを配置し、mainAxisAlignment
をstart
に設定することです。
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
FlatButton(
onPressed: () {},
child: Text('Sign Out')
), // end of FlatButton
], // end of widgets
), // end of Row