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

Question

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

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

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

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

谢谢，

Answer 1

有两点要考虑：

1. 如果您打算在下方加上更多字段RadioTiles以及Google Listing URL和Save按钮，那么保持整个屏幕可滚动可能是一个不错的选择。

2. 另一方面，如果只是位于下方的两件事RadioTiles，则最好仅使RadioTile列表可滚动。这样，用户TextField和保存按钮将始终可以被用户访问，而无需滚动。

3. 另外，您可以根据字段的优先级决定滚动。如果TextField和保存按钮具有更高的优先级，那么最好始终在屏幕上可见它们。

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

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

范例-

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

Answer 2

如果您只想保留屏幕的一部分可滚动但保留可变高度的底部元素，要完成buggycoder 的答案，您可以将您的ListView内部嵌入Expandeda Column，如下所示：

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

你在做什么基本上是告诉你Column它有 2 个（或更多）元素，其中每个元素通常占用它需要的空间，除了作为Expanded元素并且将占用Column.