SliverList 如何在 CustomScrollView 中的 SliverAppBar 上疊加

Question

想要頭像部分浮動在圖片上，頭像是下面的列表或內容，下拉時不要拉伸

CustomScrollView
  slivers
    SliverAppBar
      flexibleSpace
        background: Image
    SliverList
      CircleAvatar

CustomScrollView(
  physics: const AlwaysScrollableScrollPhysics(),
  slivers: <Widget>[
    SliverAppBar(
      floating: true,
      pinned: true,
      expandedHeight: 120.0,
      stretch: true,
      stretchTriggerOffset: 150.0,
      flexibleSpace: FlexibleSpaceBar(
        background: Image.network(indexData.banner, fit: BoxFit.cover,),
      ),
    ),
    SliverList(
      delegate: new SliverChildBuilderDelegate((BuildContext context, int index) {
        return Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                Container(
                  width: 95,
                  height: 95,
                  margin: EdgeInsets.only(left: 16),
                  child: CircleAvatar(
                    backgroundImage: NetworkImage(indexData.avatar),
                    radius: 42.5,
                  ),
                  decoration: new BoxDecoration(
                      border: new Border.all(width: 5.0, color: blackLight),
                      borderRadius: new BorderRadius.all(new Radius.circular(42.5)),
                      color: blackLight
                  ),
                )
              ],
            )
          ] ,
        );
      }, childCount: 1 ),
    ),
  ],
)

slivers使用Stack ： RenderViewport 需要一個 RenderSliv​​er 類型的孩子，但收到一個 RenderStack 類型的孩子。

為什么只有SliverList，SliverFixedExtentList，SliverGrid，SliverPadding，SliverAppBar ...可以在條子使用？

Answer 1

flexibleSpace: Stack( children: [ Positioned( child: Image( fit: BoxFit.cover, image: NetworkImage( widget.details, ), ), top: 0, left: 0, right: 0, bottom: 0), Positioned( child: Container( height: 20, 裝飾: BoxDecoration( boxShadow: [ BoxShadow( color: const Color(0x29000000), offset: Offset(0, -8), blurRadius: 15, ), ], color: Colors.white, borderRadius : BorderRadius.vertical( top: Radius.circular(50), ), ), ), bottom: -1, left: 0, right: 0, ), ], ), extendedHeight: 450.0, ), SliverList( delegate: new SliverChildBuilderDelegate((BuildContext context, int index) { return overView(); }, childCount: 1), ), ],