我有一个返回这样的容器的ListView.generator
Container(
child: Row(
children: <Widget>[
Container(
child: null,
width: 10,
height: 10,
decoration: BoxDecoration(
color: social[i].color,
shape: BoxShape.circle,
),
margin: EdgeInsets.only(right: 7, top: 1,),
),
Text(
social[i].name,
style: TextStyle(
color: Colors.white,
fontFamily: 'Muli',
fontSize: 24.0,
fontWeight: FontWeight.w700
),
)
],
),
width: social[i].name.length * 16.0,
)
我知道我是利用宽度来设置文本长度的,但它给了我一个不充分的结果,因为twitter和instagram之间的间距比应有的要大。
我想要的结果是,它们之间有一个均匀的间距。
一个间隔设置为even的Wrap小工具不会有什么帮助,因为我希望这个列表具有用户分辨率的全宽,并向左对齐。
发布于 2019-07-17 03:31:27
您可以对行元素使用mainAxisAlignment: MainAxisAlignment.spaceEvenly
,如下所示
Container(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Container(
child: null,
width: 10,
height: 10,
decoration: BoxDecoration(
color: social[i].color,
shape: BoxShape.circle,
),
margin: EdgeInsets.only(right: 7, top: 1,),
),
Text(
social[i].name,
style: TextStyle(
color: Colors.white,
fontFamily: 'Muli',
fontSize: 24.0,
fontWeight: FontWeight.w700
),
)
],
),
width: social[i].name.length * 16.0,
)
如果你想知道更多关于它的信息。https://medium.com/jlouage/flutter-row-column-cheat-sheet-78c38d242041你可以查看这篇文章。我发现它真的很有帮助。
https://stackoverflow.com/questions/57064136
复制相似问题