如何在 SliverToBoxAdapter 中有一个可滚动的列表

Question

我在 CustomSrollView 中使用以下 SliverToBoxAdapter：

        SliverToBoxAdapter(
            child: Stack(
            children: <Widget>[
              Container(
                width: double.infinity,
                height: 50,
                decoration: BoxDecoration(color: pink),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 30),
                child: ListView.builder(
                  padding: const EdgeInsets.all(0),
                  shrinkWrap: true,
                  itemBuilder: (context, index) {
                    return buildSongRow(songs[index]);
                  },
                  itemCount: songs.length,
                ),
              )
            ],
          ))

问题是列表不滚动，这很明显，因为它有框约束。我在这里使用 SliverToBoxAdapter，因为我必须将我的列表堆叠在列表顶部的某个 Container 上。如何让我的列表滚动？如果使用 SliverToBoxAdapter 无法完成，我还有其他选择吗？

Answer 1

您可以通过添加父 CustomScrollView 的相同滚动控制器来使 Listview 可滚动。

class ScrollExample extends StatelessWidget {
  final scrollController = ScrollController();
  @override
  Widget build(BuildContext context) {
    return CustomScrollView(
      //  add scrollController to sliver root
      controller: scrollController,
      slivers: <Widget>[
        SliverToBoxAdapter(
          child: Card(
            child: ListView.builder(
              //  add the same scrollController here
            controller: scrollController,
              shrinkWrap: true,
              itemCount: 19,
              itemBuilder: (BuildContext context, int index) {
                return Text("ibnShamas");
              },
            ),
          ),
        ),
      ],
    );
  }
}