验证码:
new Container(
alignment: FractionalOffset.center,
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
new FlatButton(
child: new Text('Don\'t have an account?', style: new TextStyle(color: Color(0xFF2E3233))),
),
new FlatButton(
child: new Text('Register.', style: new TextStyle(color: Color(0xFF84A2AF), fontWeight: FontWeight.bold),),
onPressed: moveToRegister,
)
],
),
),
结果是这样的:https://dartpad.dev/?id=6bbfc6139bdf32aa7b47eebcdf9623ba
如何修复两个FlatButton
元素并排在屏幕宽度的中心之间没有空间?
9条答案
按热度按时间2ic8powd1#
有很多方法可以做到这一点,我在这里列出几个:
1.如果要设置特定空间,请使用**
SizedBox
**1.如果希望两者尽可能远离,请使用**
Spacer
**。1.**
mainAxisAlignment
**根据您的需要使用:1.使用**
Wrap
代替Row
并给予一些spacing
**1.使用**
Wrap
而不是Row
,并给予它对齐**sh7euo9m2#
主轴对齐
start-将子对象尽可能靠近主轴的起点放置。
end-将子对象尽可能靠近主轴的末端放置。
center-将子对象尽可能靠近主轴的中间放置。
spaceBetween-在子对象之间均匀放置可用空间。
spaceAround-在子元素之间均匀放置可用空间,并在第一个和最后一个子元素之前和之后放置该空间的一半。
spaceEvenly-在子元素之间以及第一个和最后一个子元素之前和之后均匀放置可用空间。
jrcvhitl3#
删除空间-:
或
uubf1zoe4#
如果你只想在一行中的项目之间留一点间距,你可以使用Spacers。下面的例子将两个文本小部件放在一行的中间,它们之间留有一些间距。
Spacer创建了一个可调的空间隔,可用于调整
Flex
容器中小部件之间的间距,如Row
或Column
。在
row
中,如果我们想在两个小部件之间放置空间,使其占用所有剩余空间。uz75evzq5#
为了精确的间隔,我使用
Padding
。一个有两个图像的例子:yvgpqqbh6#
只需添加“Container(width:5、颜色:颜色。透明)、“元素之间
noj0wjuj7#
这对我来说是有效的,行内有3个小部件:柔性,容器,柔性
7cjasjjr8#
我相信最初的帖子是关于 * 删除 * 一排按钮之间的空间,而不是增加空间。
诀窍是按钮之间的最小空间是由于填充内置到按钮作为材料设计规范的一部分。
所以,不要使用按钮!而是一个GestureDetector代替。这种小部件类型给予
onClick
/onTap
功能,但没有样式。看这篇文章的例子。
https://stackoverflow.com/a/56001817/766115
5us2dqdw9#
*这里的另一个 * 自定义方法 ,我们可以使用任何地方的 * 水平 * 和 * 垂直 * 间距
此方法用于自定义水平间距
此方法用于自定义垂直间距