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

Question

当使用FloatingActionButton与结合ListView，它隐藏了的UI的一部分ListView条目，如在屏幕截图。
有没有办法在 a 的底部自动添加额外的间距，ListView以便 + 按钮不隐藏任何内容？

Answer 1

假设您正在使用ListView，有一个非常好的和简单的解决方案。
你可能不希望添加填充的周围ListView本身，因为这将让你的UI未使用的部分地区。

ListView有一个padding参数正好适用于这个用例。您基本上可以ListView在作为可滚动区域一部分的底部添加一些填充。这意味着您只有在一直滚动到底部后才会开始看到此填充。这将允许您将最后几个项目拖到FloatingActionButton.
要为填充找到合适的值，您可以使用kFloatingActionButtonMarginand _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: () {},
    ),
  )));
}