在 Flutter 中使屏幕的一部分可滚动

Question

我只想让屏幕的一部分可以滚动。当我的 ListView 中的项目数超过 4 或 5 时，我无法在此列表视图下方放置任何小部件。我不确定是否有办法包装列表视图的所有内容以使其可滚动。

  ListView(
    shrinkWrap: true,
    physics: NeverScrollableScrollPhysics(),
    children: _getListings(businessListing),
  ),

这是我的 ListView，这是 UI 的外观

当RadioTile数量超过8个时出现问题； textField 和 Button 被推出屏幕。我想知道使整个屏幕可滚动是否好？或者只让屏幕的一部分包含 RadioTiles Scrollable？

谢谢，

Answer 1

有几点需要考虑：

如果您计划在 RadioTiles 下方添加更多字段以及 Google 列表 URL 和“保存”按钮，那么它可能是一个不错的选择保持整个屏幕可滚动。
另一方面，如果只是 RadioTiles 下面的两件事，那么最好只保留 RadioTile 列表可滚动.这样，用户无需滚动即可始终访问 TextField 和“保存”按钮。
此外，您可以根据字段的优先级决定滚动。如果 TextField 和保存按钮具有更高的优先级，那么最好让它们始终在屏幕上可见。

要使屏幕的一部分可滚动，您可以将 ListView 包裹在具有固定高度的 Container 中，这样它就只会在这些范围内滚动。

您还需要将 physics 属性更改为 AlwaysScrollableScrollPhysics()。

例子-

Container(
  height: 300.0 //Your custom height
  child: ListView(
    shrinkWrap: true,
    physics: AlwaysScrollableScrollPhysics(),
    children: _getListings(businessListing),
  ),
)

Answer 2

要完成，如果您只想保留屏幕的一部分可滚动但保留可变高度的底部元素，您可以将 ListView 嵌入 Expanded 中 Column，如下图：

Column(
    children: [
      Expanded(
        child: ListView(
           children: _getListings(businessListing),
        ),
      ),
      Container(
        child: Text('This element must stay at the bottom'),
      ),
    ],
  );

你在那里做什么基本上是告诉你的 Column 它有 2 个（或更多）元素，其中每个元素通常采用它需要的 space，除了元素是 Expanded 元素，并将在 Column.

中取“最大 space 剩余”

在 Flutter 中使屏幕的一部分可滚动

Make a part of the screen scrollable in Flutter

user-experience

flutter

flutter-layout