本文介绍了全宽按钮,如何对齐文本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

试图弄清楚我是否可以在全宽按钮中对齐文本,即具有 width: double.infinity

Trying to figure out if I can align the text in a full width button, i.e a button that has width: double.infinity

例如:

ButtonTheme(
  minWidth: double.infinity,
  child: FlatButton(
    onPressed: () {},
    child: Text('Sign Out', textAlign: TextAlign.left),
  ),
)

产生一个居中的文本按钮并且不能改变对齐方式.

produces a centered text button and the alignment cannot be changed.

我尝试了一些方法,但无法弄清楚,除非我尝试创建自定义按钮.

I have tried a few things but can't figure it out, unless I try to create a custom button.

我正在尝试获得一个带有 text:left 的全宽按钮,以便用户可以单击行中的任意位置,并且仍然可以获得材料点击效果.

I'm trying to get a full width button with text:left so the user can click anywhere in the row, and still get the material tap effect.

推荐答案

发现RawMaterialButton的build-Method the child是始终居中:

I found out that RawMaterialButton's build-Method the child is always centered:

child: Center(
  widthFactor: 1.0,
  heightFactor: 1.0,
  child: widget.child,
),

要让文本与开始/左对齐,您可以给它一个无限宽度,这将使它与它的父级中心小部件一样宽.

To have the text to be aligned to start/left you could give it an infinite width, which would make it as wide as its parent, the Center widget.

child: FlatButton(
  child: SizedBox(
    width: double.infinity,
    child: Text(
      'Sign out',
      textAlign: TextAlign.left,
    ),
  ),
  onPressed: () {},
);

这篇关于全宽按钮,如何对齐文本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

07-18 04:43
查看更多