Question

我有一个带有条的CustomScrollView可以正常工作，但是没有找到一种方法来完全隐藏SliverAppBar的顶部（即，在滚动时，我想隐藏图像和标题，但显示底部）：< / p>

编辑：如图中所示，我想在滚动时保持SliverAppBar的底部。设置为“固定：false”会同时在滚动条上同时隐藏，因此对我不起作用。

即使我没有添加填充，我也希望标题隐藏起来，像这样：

现在它被截断了，我真的很想隐藏它。

我见过一些帖子，可以在NestedScrollView中隐藏标题（例如，上面的gif），但如果可能的话，我想保留CustomScrollView吗？

这是我的代码：

class QuestionsScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final questionsMgr = Provider.of<Questions>(context);
    final List<Question> questions = questionsMgr.questions;

    return CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
          bottom: PreferredSize(
            preferredSize: const Size.fromHeight(0),
            child: ChangeNotifierProvider.value(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    ScoreText(),
                    InstructionsText(),
                  ],
                ),
              ),
            ),
          ),
          backgroundColor: questionsMgr.getScoreColor(),
          floating: false,
          expandedHeight: 225,
          pinned: true,
          title: Text(
            "Checklist",
            textAlign: TextAlign.center,
          ),
          forceElevated: true,
          flexibleSpace: FlexibleSpaceBar(
            centerTitle: true,
            background: Image.asset(
              "assets/images/PalFM_blue.jpg",
              fit: BoxFit.cover,
            ),
          ),
        ),
        SliverList(

Answer 1

SliverAppBar(
      pinned: true,
      floating: false,          
      bottom: PreferredSize(
        preferredSize: Size.fromHeight(0),
        child: AppBar(

将SliverAppBar的bottom属性设置为PreferredSize小部件。将此底部窗口小部件的preferredSize属性设置为0（Size.fromHeight（0）），以便在折叠条子时，条子应用程序栏的高度将变为应用条的高度。

Answer 2

如果您希望SliverAppBar折叠起来，但是bottom仍然可见，那么您可以这样做：

要使SliverAppBar扩展/收缩其内容并防止其消失：

pinned: true

应用栏在用户滚动时仍可以展开和收缩，但是将保持可见状态，而不是滚动到视线之外。（pinned）

要使SliverAppBar的内容在滚动时显示/消失：

floating: true

用户滚动后，应用栏是否应该立即可见指向应用程序栏。（floating）

然后，bottom小部件的PreferredSize不应为0，而应为bottom小部件的实际高度。

preferredSize: const Size.fromHeight(60),

在滚动条上隐藏Flutter SliverAppBar中的标题

2 个答案: