dart - ListView.Builder 之后的底部填充
问题描述
我在底部表中有一个 Listview .. 像这样:
showModalBottomSheet(
context: context,
builder: (BuildContext context) {
return Directionality(
textDirection: globals.getDirection(),
child: Container(
margin: EdgeInsets.only(
right: 10.0,
left: 10.0),
height: MediaQuery.of(context).size.height / 2,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Flexible(
child: TextField()
),
Expanded(
child: ListView.builder(
shrinkWrap: false,
itemCount: nationalities.length,
itemBuilder: (BuildContext context, int index) {
return new Padding(
padding: EdgeInsets.only(top: 10.0),
child: GestureDetector(
onTap: () {
setState(() {
_data.nationality = nationalities[index];
});
Navigator.pop(context);
},
child: Text(
nationalities[index],
textAlign: TextAlign.center,
),
));
},
),
),
),
);
}
);
问题是我在底部有巨大的空白,我现在不知道它是从哪里来的......正如你从屏幕截图中看到的那样:
如何删除此空白并使列表视图在其中展开?
解决方案
使用 Expanded 小部件可使 Row、Column 或 Flex 的子项展开以填充主轴中的可用空间(例如,水平地用于行或垂直地用于列)。如果展开多个子节点,则可用空间根据弹性因子在它们之间分配。那可能是你的问题。删除它可能会对您有所帮助。接下来... 使用 Flexible 小部件为 Row、Column 或 Flex 的子级提供了扩展的灵活性以填充主轴上的可用空间(例如,水平的 Row 或垂直的 Column),但是,不像Expanded, Flexible 不需要孩子填满可用空间。下一件事:
默认情况下,ListView 将自动填充列表的可滚动末端,以避免 MediaQuery 填充指示的部分障碍。为避免此行为,请使用零填充属性覆盖。
ListView(
padding: EdgeInsets.zero,
...);
第二种选择
MediaQuery.removePadding(
context: context,
removeTop: true,
child: ListView(...),
)
对不起Exrta解释;
推荐阅读
- flutter - Flutter - 如何在用户滚动时最小化 Text()
- java - 在 Ubuntu Linux AWS 上安装 Java 插件
- html - 为什么当我将页面放到网上时,我的 css 无法正常工作?
- java - java中的Avro不可变生成类
- sql - 使用案例结果的 SQL 更新
- c++ - 递归地将 std::tuple 转换为 std::variant
- python-3.x - 如何从存储在python中另一个类中的类中访问数据?
- amazon-cloudformation - 将手动创建的 Cognito 用户池与放大项目一起使用
- vb.net - 如何在 EntityFramework 中更改对象的值,然后再将其显示在网页上?
- plantuml - 在 PlantUML 中垂直对齐包