带有 ListView 的 Flutter Column 及其上方的更多小部件答案

【问题标题】：Flutter Column with ListView and more Widgets above it带有 ListView 的 Flutter Column 及其上方的更多小部件
【发布时间】：2022-08-16 22:14:41
【问题描述】：

我正在尝试一个简单的标题 -> 搜索框 -> listview 的东西，但无法弄清楚如何在不触发可怕的溢出错误的情况下填充屏幕。

body: Padding(
    padding: const EdgeInsets.all(8.0),
    child: Column(
      children: [
        Text(\'title\', textAlign: TextAlign.center, style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),),
......
TextField(textfield_settings),
SingleChildScrollView(
          child: Container(
            height: MediaQuery.of(context).size.height * 0.6, // the part i want to get rid of and have a flexible height, based on the total screen size and the other widgets
            child: ListView.builder(itemBuilder: (ctx, index) {})
    )
)

我基本上希望包含 ListView.builder 的 SingleChildScrollView 占据正文中剩余的空间。

谢谢！

标签： flutter dart flutter-layout

【解决方案1】：

在 ListView 上使用 Expanded

body: Padding(
  padding: const EdgeInsets.all(8.0),
  child: Column(
    children: [
      Text(
        'title',
        textAlign: TextAlign.center,
        style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
      ),
      TextField(),
      Expanded(
        child: ListView.builder(
          itemBuilder: (ctx, index) {
            return Text("sds");
          },
        ),
      ),
    ],
  ),
),

【讨论】：