Flutter：将SliverAppbar与Column小部件结合在一起

问题描述

我正在尝试为一个应用创建一个事件页面，用户可以在其中查看包含横幅图像和其他有用信息的事件。我真的很喜欢用横幅实现SliverAppBar的想法，以便用户可以滚动以查看更多信息。为此，我似乎需要一个带有SliverAppBar和FlexibleSpaceBar的CustomScrollView。

我在网上看到的所有教程都假定屏幕的其余部分应该是各种列表，但是我宁愿想要诸如Column小部件之类的东西。但是，列的高度是无限制的，这会导致CustomScrollView中发生溢出错误。我可以将其包装在具有指定高度的容器中，但是主体的内容大小可变，因此并不理想。有没有办法让SliverAppBar和Column并排工作？

我想要一些类似的东西：

class ActivityPage extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(slivers: [
          SliverAppBar(
            flexibleSpace: FlexibleSpaceBar(
              background: Image(someImage),),expandedHeight: Image,floating: false,pinned: true,snap: false,Column(
            children: [
              someChildren,]
            ),)
        ]),);
  }

应该有可能，因为在我看来这是一种常见的模式，但是我环顾了很多，我只能找到正文由列表组成的示例...

解决方法

使用 ListView 而不是 Column。 ListView 具有动态大小

,

对于任何遇到同样困难的人：这是我刚刚找到的解决方案：

Widget build(BuildContext context) {
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder:
            (BuildContext context,bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              backgroundColor: this.color,flexibleSpace: FlexibleSpaceBar(
              background: YourImage(),),)
          ];
          },body: Container(
          child: Builder(builder: (context) {
            return Column(
              mainAxisAlignment: MainAxisAlignment.start,children: [
                  WidgetOne(),WidgetTwo()
                ]);
          })),)),);
  }

,

对我来说最好的方法是使用 SliverToBoxAdapter。只需将您的 Column 包裹在 Container 中，然后将此 Container 包裹在 SliverToBoxAdapter 中，它应该可以正常工作。