透明重叠应用栏答案

【问题标题】：Transparent overlapping appbar透明重叠应用栏
【发布时间】：2019-10-07 12:55:55
【问题描述】：

我正在尝试找到一种方法来创建一个与页面内容重叠的透明应用栏。我知道我可以使用 SliverAppBar 最初显示 appbar，然后在滚动时让它滑出视图，这很好。我什至可以给它一个透明的背景颜色。但是，当您滚动到页面顶部时，它始终会为该栏腾出空间位于页面内容上方。

我想要的是将页面内容与页面顶部齐平，就好像没有应用栏一样，然后像 SliverAppBar 一样让透明的应用栏滑入视图，这样我就只有一些操作按钮与页面顶部重叠。

我怎样才能做到这一点？有没有办法堆叠应用栏或更改边距以使其不占用空间？

【问题讨论】：

嗯......你不应该这样做，任何设计语言都不建议这样做，所以最好避免这样的事情。
这是用于颤振或 android jetpack compose 还是任何其他框架？

标签： flutter flutter-sliver flutter-appbar

【解决方案1】：

您可以将脚手架和您的“页面”放在stack() 中，确保脚手架是堆栈中的最后一项。您可以自己为应用栏添加动画，甚至可以使用 sliver 应用栏，只要确保为应用栏和内容使用相同的滚动控制器即可。

例如：

 @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        // Your content
        Container(
          color: Colors.pink,
        ),

        Scaffold(
          appBar: AppBar(
            title: Text("heading"),
            bottom: AppBar(
              title: Text("footer"),
            ),
          ),
        ),
      ],
    );
  }

【讨论】：