Custom Flutter widget to return two widgets for use with CustomScrollView / slivers

Question

I have a Flutter CustomScrollView with the following structure:

body: CustomScrollView(
  slivers: <Widget>[
    MyCustomTitle(...),
    MyCustomSliverGrid(...)
    MyCustomTitle(...),
    MyCustomSliverGrid(...)
    MyCustomTitle(...),
    MyCustomSliverGrid(...)
    ...
  ],
),

MyCustomTitle extends StatelessWidget and in the build method returns a SliverToBoxAdapter widget, and the MyCustomSliverGrid widget extends StatelessWidget and in the build method returns a SliverGrid widget.

How can I implement a single Widget (MyCustomSliverGridWithTitle) that returns both the custom title and the custom SliverGrid? From the build method of a StatelessWidget I can only return a single Widget, not two.

Solution

You can bundle MyCustomTitle and MyCustomSliverGrid into one widget with MultiSliver.

class MyCustomSliverGridWithTitle extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiSliver(
      children: <Widget>[
        MyCustomTitle(...),
        MyCustomSliverGrid(...),
      ],
    );
  }
}

Comments

[Till Friebe]

I have the same problem and could not solve it, so I created an issue.