您也可以使用AnimatedContainer代替AppBar，并将其放置在所有其他Widget之上。这提供了高度可以动画的优势，因此其他Widget可以随着AnimatedContainer使用的空间向下滑动。
更多信息见这里：AnimatedContainer

如果你想坚持使用AppBar，你应该考虑使用像SliverAppBar这样的东西，它有expandedHeight属性，你可以设置它的高度并在事件中更改它。

注意SliverAppBar应该放在 scrollview 里面，属性为slivers，例如--CustomScrollView

更多信息：
SliverAppBar（官方）
CustomScrollView（官方）
unofficial guide可能会对您有所帮助

以下是我的回答，有两种情况：
在第一种情况下，bar需要在屏幕上占用一些垂直空间。所以我删除了appBar，而是将Scaffold Package 在Expanded中，然后 Package 在Column中。在控制器中，我定义了一个名为topBarWidget的变量。当控制器创建时，我们初始化那个小部件，要么是我的无连接条，要么是一个0高度的SizedBox。我们还将这个逻辑连接到处理连接检测的函数。最后，我在Column的顶部添加了一个AnimatedSize小部件，并将topBarWidget作为子部件。效果很好，但要确保Column被 Package 在安全区域中。
在第二种情况下，我发现我不需要我的小部件来占用垂直空间，所以我只是在控制器中添加了相同的逻辑来定义一个topBarWidget。然后，我用一个使用SizeTransition的转换构建器将该topBarWidget Package 在AnimatedSwitcher中。
你会发现代码的结果。谢谢@dstreissi把我放在正确的轨道上。

1 -占用垂直空间

SafeArea(
    child: Column(
        children: [
            AnimatedSize(
                duration: const Duration(milliseconds: 800),
                curve: Curves.easeIn,
                child: viewModel.topBarWidget,
            ),
            Expanded(
                child: Scaffold(...),
            ),...,
);

2 -在Z轴上堆叠

SafeArea(
            child: Scaffold(
              ...
              body: Stack(
                children: [
                  SingleChildScrollView(
                    child: Column(
                      children: [...],
                    ),
                  ),
                  AnimatedSwitcher(
                    duration: const Duration(milliseconds: 800),
                    transitionBuilder: (Widget child,
                    Animation<double> animation) => SizeTransition(sizeFactor: animation, child: child,),
                    child: viewModel.topBarWidget,
                  ),
                ],
              ),
            ),
          );

请注意我是如何将ScrollView放在Stack中的，这样即使向下滚动，noConnection消息也会停留在屏幕的顶部。