flutter - 如何在 ListView 中添加额外的底部间距？

Question

将 FloatingActionButton 与 ListView 结合使用时，它会隐藏 ListView 条目的部分 UI，如屏幕截图所示。
有没有办法在 ListView 的底部自动添加额外的间距，这样 + 按钮就不会隐藏任何内容？

Answer 1

假设您使用的是 ListView ，有一个非常好的和简单的解决方案。
您可能不想要在 ListView 本身周围添加填充，因为这会使您的 UI 的某些区域未被使用。

ListView 有一个 padding parameter对于这个用例。实际上，您可以在作为可滚动区域 一部分的ListView 底部添加一些填充。这意味着只有一直滚动到底部后，您才会开始看到此填充。这将允许您将最后几个项目拖到 FloatingActionButton 上方。
要为填充找到合适的值，您可以使用 kFloatingActionButtonMargin和 _kExtendedSizeConstraints ，这是不可访问的，因此，我将像这样使用 48。

这意味着您需要将以下内容添加到您的 ListView:

ListView(
  padding: const EdgeInsets.only(bottom: kFloatingActionButtonMargin + 48),
  ..
)

这是一个工作示例:

import 'package:flutter/material.dart';

main() {
  runApp(MaterialApp(
      home: Scaffold(
    body: ListView.builder(
        padding: const EdgeInsets.only(bottom: kFloatingActionButtonMargin + 48),
        itemCount: 23,
        itemBuilder: (context, index) => ListTile(
              trailing: Text('$index'),
            )),
    floatingActionButton: FloatingActionButton(
      onPressed: () {},
    ),
  )));
}