gpt4 book ai didi

dart - 带有 NestedScrollview 的 RefreshIndicator

转载 作者:行者123 更新时间:2023-12-02 11:18:59 26 4
gpt4 key购买 nike

我想要 2 个带有 ListView 的标签页,每个标签页共享一个 RefreshIndicator。但是,RefreshIndicator 必须将 Scrollable 作为子项(TabBarView 不是),因此我尝试为每个选项卡制作 2 个 RefreshIndicators,如下面的代码所示。

但这带来了一个不同的问题,我还想要一个 float 的 AppBar,这意味着我必须使用 NestedScrollView。因此,每当我向下滚动时,我最终都会触发两个 RefreshIndicators 的 onRefresh 方法。而我只需要一个来刷新。

import 'package:flutter/material.dart';

main() {
runApp(
MaterialApp(
home: DefaultTabController(
length: 2,
child: Scaffold(
body: NestedScrollView(
headerSliverBuilder: (context, innerBoxIsScrolled) {
return [
SliverAppBar(
floating: true,
snap: true,
bottom: TabBar(
tabs: [
Tab(text: 'Page1'),
Tab(text: 'Page2'),
],
),
),
];
},
body: TabBarView(
children: [
Page(1),
Page(2),
],
),
),
),
),
),
);
}

class Page extends StatefulWidget {
final pageNumber;
Page(this.pageNumber);
createState() => PageState();
}

class PageState extends State<Page> with AutomaticKeepAliveClientMixin {
get wantKeepAlive => true;

build(context){
super.build(context);
return RefreshIndicator(
onRefresh: () => Future(() async {
print('Refreshing page no. ${widget.pageNumber}'); // This prints twice once both tabs have been opened
await Future.delayed(Duration(seconds: 5));
}),
child: ListView.builder(
itemBuilder: ((context, index){
return ListTile(
title: Text('Item $index')
);
}),
)
);
}
}

AutomaticKeepAliveClientMixin 用于防止每次切换选项卡时重新构建页面,因为这在我的实际应用程序中将是一个昂贵的过程。

对两个选项卡使用单个 RefreshIndicator 的解决方案将是最理想的,但感谢任何帮助。

最佳答案

这段代码对我有用,它主要建立在@Nuts 答案之上,但它需要一些调整,我的编辑被拒绝了

DefaultTabController(
length: tabs.length,
child: RefreshIndicator(
notificationPredicate: (notification) {
// with NestedScrollView local(depth == 2) OverscrollNotification are not sent
return notification.depth == 2;
},
onRefresh: () => Future.value(null),
child: NestedScrollView(
headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
return [
SliverAppBar(...)
];
},
body: TabBarView(
children: tabs,
),
),
),
)

关于dart - 带有 NestedScrollview 的 RefreshIndicator,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52264270/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com