そのため、各 SliverItem にスティッキー ヘッダーを使用して双方向スクロールを作成しようとしています。
https://github.com/fluttercommunity/flutter_sticky_headersをアイテムとして使用して、両方向にスクロールを無限にしました。
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text(widget.title),),
body: Scrollable(
controller: _controller,
viewportBuilder: (BuildContext context, ViewportOffset offset) {
return Viewport(
offset: offset,
center: positiveListKey,
slivers: [
_negativeListView,
_positiveListView,
]);
},
),
);
}
SliverList get _positiveListView => SliverList(
key: positiveListKey,
delegate: SliverChildBuilderDelegate((context, index) {
return StickyHeader(
header: new Container(
height: 50.0,
color: Colors.blueGrey[700],
padding: new EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerLeft,
child: new Text('Header #$index',
style: const TextStyle(color: Colors.white),
),
),
content: new Container(
height: 300,
child: Text("Context #${index.toString()}"),
),
);
}),
);
SliverList get _negativeListView => SliverList(
delegate: SliverChildBuilderDelegate((context, i) {
int index = (i + 1) * -1;
return Container(
child: StickyHeader(
header: new Container(
height: 50.0,
color: Colors.blueGrey[700],
padding: new EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerLeft,
child: new Text('Header #$index',
style: const TextStyle(color: Colors.white),
),
),
content: new Container(
height: 300,
child: Text("Context #${index.toString()}"),
),
),
);
}),
);
ここにいくつかのスクリーンキャストがあります - https://i.ibb.co/ZLJvwsG/sticky-jump.gif
問題は、両方の SliverLists がビューポートに表示されると、スティッキー ヘッダーがジャンプし始めることです。StickyHeader パッケージは非常に単純markNeedsLayoutです。スクロール位置が変更されたときに、ヘッダー el の位置を (リスナーとして) 更新するだけです。
これが位置計算です - https://github.com/fluttercommunity/flutter_sticky_headers/blob/master/lib/sticky_headers/render.dart#L94
ここにイベントバインドがあります https://github.com/fluttercommunity/flutter_sticky_headers/blob/master/lib/sticky_headers/render.dart#L79
_scrollableで定義されていますScrollable.of(context);
このタイプの効果を作成するのは、少し遅れてイベントが発生したり、ビューポートが再描画されたりするように見えます。
助けが必要なのか、解決策や説明が必要なのか - なぜそれが起こるのか?
本当は理由だけでいいんですけどね）そもそもなんでこうなったのか知りたいです。理解することで、私は機能するソリューションを提供できるようになります）
アップデート
わかりましたので、しばらくして、元の問題が何であるかを見つけました。必要に応じてスクロールリストを作成するために、この問題を解決するために独自のパッケージを作成しました)
https://github.com/TatsuUkraine/flutter_sticky_infinite_list
そのようなパッケージのほとんどがスクロール イベントにバインドする方法と、スティッキー アイテムの位置を計算する方法を変更したため、元の質問で説明されている問題はありません。
自由に使用して提案してください）