FloatingActionButton 在列表的最后一项上

Question

我有一个带有 FloatingActionButton 的可滚动列表。我想让列表在 FloatingActionButton 之前完成，因为列表的最后一项不再可见（FAB 它已超过列表项）

return Scaffold(
    body: ListView(
      scrollDirection: Axis.vertical,
      controller: _scrollController,
      shrinkWrap: true,
      children: <Widget>[
        _buildUpcomingExpansionTileEvents(myUpcomingEvents),
        _buildPastExpansionTileEvents(myPastEvents),
      ],
    ),
    floatingActionButton: UnicornDialer(
        parentButtonBackground: Colors.blue,
        orientation: UnicornOrientation.VERTICAL,
        parentButton: Icon(OMIcons.add),
        childButtons: childButtons));

我怎样才能更改我的列表以用一个空项目结束？或者这个问题的最佳解决方案是什么？

Answer 1

FloatingActionButton 非迷你尺寸为 56，迷你尺寸为 40，因此您可以在 ListView 中使用 padding，例如:

ListView(
  padding: EdgeInsets.only(bottom: 56), // if you have non-mini FAB else use 40
  // ...
),

Answer 2

为了解决这个问题，我只添加了一个大小合适的框作为列表中的最后一个元素。这样，当用户滚动到列表底部时，您仍然可以在正确的位置突出显示列表的结尾。

ListView(
  scrollDirection: Axis.vertical,
  controller: _scrollController,
  shrinkWrap: true,
  children: <Widget>[
    _buildUpcomingExpansionTileEvents(myUpcomingEvents),
    _buildPastExpansionTileEvents(myPastEvents),
    SizedBox(
      height: 100, // or whatever height works for your design
    ),
  ],
),

FloatingActionButton 在列表的最后一项上

FloatingActionButton over last item of list

dart

floating-action-button

flutter

flutter-layout