Flutterはmaterial連動スクロールNestedScrollViewのような
2131 ワード
効果図1.外層ラップ-nestedScrollView(
--children:ListView()/いくつかのitemを作成
//このheaderSliverBuilderは必須このWidget[]現在のテストはSliverAppBarかAppbarしかできないようです
--headerSliverBuilder:(BuildContext context,bool innerBox Issrolled){//SliverAppBar``を作成する
} )
完全なコード:
公式チュートリアルでよくわかりました:api.flutter.dev/flutter/wid…
--children:ListView()/いくつかのitemを作成
//このheaderSliverBuilderは必須このWidget[]現在のテストはSliverAppBarかAppbarしかできないようです
--headerSliverBuilder:(BuildContext context,bool innerBox Issrolled){//SliverAppBar``を作成する
SliverAppBar(
expandedHeight: 214,
flexibleSpace: FlexibleSpaceBar(
background: Container(
width: double.infinity,
height: 214,
child: Image(
image: NetworkImage('http://img.ring.51app.cn/small/51/1430938641998.jpg'),
fit: BoxFit.fitWidth,
),
),
),
),
```
} )
完全なコード:
NestedScrollView(
body: new Column(
children: [
Flexible(
flex: 1,
fit: FlexFit.tight,
child: ListView(
children: _getItem(),
),
)
],
),
headerSliverBuilder:
(BuildContext context, bool innerBoxIsScrolled) {
return [
SliverAppBar(
expandedHeight: 214,
flexibleSpace: FlexibleSpaceBar(
background: Container(
width: double.infinity,
height: 214,
child: Image(
image: NetworkImage('http://img.ring.51app.cn/small/51/1430938641998.jpg'),
fit: BoxFit.fitWidth,
),
),
),
),
];
},
controller: ScrollController(),
)
公式チュートリアルでよくわかりました:api.flutter.dev/flutter/wid…