Flutter Wrap 小部件对齐:在 ExpansionPanel 内部
Posted
技术标签:
【中文标题】Flutter Wrap 小部件对齐:在 ExpansionPanel 内部【英文标题】:Flutter Wrap widget align: left inside ExpansionPanel 【发布时间】:2020-10-23 02:10:16 【问题描述】:这很奇怪,包含 FilterChips 的 Wrap 小部件以它的父级 ExpansionPanel 为中心。我尝试将 Wrap 小部件包装在 Flexible 小部件中,没有反应,我尝试包装在 Expanded 小部件中,没有反应。
扩展面板上似乎没有一个属性可以左对齐正文:小部件。这很重要,因为当 Wrap 小部件被强制为全宽时,一些 ExpansionPanel 向左对齐,而其他的,如图所示,居中。最终,我会将 ExpansionPanel 中的所有子小部件包装在一个 Padding 小部件中,但我需要先将子 Wrap 小部件向左对齐。
bool travelSack;
ExpansionPanelRadio backpackingPanel = ExpansionPanelRadio(
value: "Backpacking",
headerBuilder: (BuildContext context, bool isExpanded)
return ListTile(
leading: FaIcon(
FontAwesomeIcons.globeEurope,
size: 19,
),
title: Text("Backpacking"),
);
,
body: Expanded(child:
Wrap(spacing: 4, children: [
FilterChip(
showCheckmark: false,
label: Text('Travel rucksack'),
labelStyle: TextStyle(
color: travelSack ? Colors.black : Colors.white,
),
selected: travelSack,
onSelected: (bool selected)
setState(()
travelSack = !travelSack;
);
,
selectedColor: Colors.green.shade500,
backgroundColor: Colors.grey.shade500,
),
])
);
我是 Scoobied,感谢您的帮助。
【问题讨论】:
【参考方案1】:我通过将 Wrap 小部件嵌套在 Align 小部件中解决了这个问题:
Align(
alignment: Alignment.topLeft,
child: Wrap(....
我不喜欢我的解决方案,我担心嵌套对性能的影响如此之大,而且庞大的代码会损害易读性,因此,如果您有更好的解决方案,我会全力以赴。 x 山姆。
【讨论】:
【参考方案2】:Wrap
有一个 alignment
属性,您可以使用它来对齐子级。
Wrap(
...
alignment: WrapAlignment.center,
children: [],
),
【讨论】:
以上是关于Flutter Wrap 小部件对齐:在 ExpansionPanel 内部的主要内容,如果未能解决你的问题,请参考以下文章