flutter - 如何将 BorderRadius 赋予 SliverList

Question

我正在使用 SliverAppBar和 SliverListView在我的项目中。
我需要BorderRadius到我的 SliverList这是我的 SliverAppBar 的底部.
这是我需要的屏幕截图:

这是我的代码:

Scaffold(
    body: CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
            backgroundColor: Colors.transparent,
            brightness: Brightness.dark,
            actions: <Widget>[
              IconButton(icon: Icon(Icons.favorite), onPressed: () {}),
              IconButton(icon: Icon(Icons.share), onPressed: () {})
            ],
            floating: false,
            pinned: false,
            //title: Text("Flexible space title"),
            expandedHeight: getHeight(context) - MediaQuery.of(context).padding.top,
            flexibleSpace: Container(
              height: double.infinity,
              width: double.infinity,
              decoration: BoxDecoration(
                image: DecorationImage(
                  fit: BoxFit.cover,
                  image: AssetImage("assets/images/Rectangle-image.png")
                )
              ),
            ),
            bottom: _bottomWidget(context),
          ),
           SliverList(
            delegate: SliverChildListDelegate(listview),
          ),
      ],
    ),
  )

所以，有了这段代码，用户界面就像这样......

可以建议我可以采取的任何其他方法来实现这种设计......

Answer 1

我使用 SliverToBoxAdapter 实现了这个设计我的代码是这样的。

final sliver = CustomScrollView(
  slivers: <Widget>[
    SliverAppBar(),
    SliverToBoxAdapter(
      child: Container(
        color: Color(0xff5c63f1),
        height: 20,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.end,
          children: <Widget>[
            Container(
              height: 20,
              decoration: BoxDecoration(
                color: Colors.white,
                  borderRadius: BorderRadius.only(
                    topLeft: const Radius.circular(20.0),
                    topRight: const Radius.circular(20.0),
                  ),
              ),
            ),
          ],
        ),
      ),
    ),
    SliverList(),
  ],
);

我在 SliverToBoxAdapter 中使用了 2 个容器。

SliverToBoxAdapter 介于 Sliver Appbar 和 Sliver List 之间。

首先，我为角边缘创建一个蓝色(应该是 Appbar 颜色)容器。

然后我在 ListView 的蓝色容器内创建了具有边界半径的相同高度的白色容器。

Preview on dartpad