flutter - 从一个更改到另一个时,所有选项卡都会不断重建
问题描述
我遇到了这个问题,我在四个选项卡之间进行切换,每次单击其中一个选项卡时,CupertinoTabView 中的所有 4 个小部件都会重建。
我尝试将三进制更改为开关,但结果是一样的。还尝试在所有 4 个页面上使用 automatickeepaliveclientmixin(使用 super on build 方法和 wantKeepAlive getter),但没有用。
这部分的代码如下:
class _MainTabsState extends State<MainTabs> {
_buildCartButton(index) {
// Some code I do here
}
int index = 0;
@override
Widget build(BuildContext context) {
return CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: [
BottomNavigationBarItem(
title: Text(I18n.of(context).home, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.home),
),
BottomNavigationBarItem(
title: Text(I18n.of(context).search, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.search),
),
_buildCartButton(index),
BottomNavigationBarItem(
title: Text(I18n.of(context).user, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.person),
),
],
activeColor: Colors.orange,
currentIndex: index,
onTap: (ind) {
setState(() {
index = ind;
});
},
),
tabBuilder: (context, i) {
return CupertinoTabView(builder: (context) {
return (i == 0)
? HomePage()
: (i == 1) ? SearchPage() : (i == 2) ? CartPage() : UserPage();
});
},
);
}
}
我只是在每个页面的构建方法开始时打印一些东西,每次更改选项卡时都会看到 4 个打印件。
此外,我正在使用 Cupertino,因为我需要在页面中保持底部栏的持久性(例如,我在 HomePage 上使用导航器通向另一个屏幕,并且我需要在那里显示底部栏)。
编辑:这是其中一页的代码。我在每一页都进行打印,每次单击其中一个选项卡时,我都会在终端上看到打印。
class HomePage extends StatefulWidget {
HomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin {
_changeLanguage(CartModel model) {
if (I18n.of(context).toString() == 'Instance of \'_I18n_en_US\'') {
I18n.onLocaleChanged(Locale('pt', 'BR'));
model.changeCurrency('BRL');
}
if (I18n.of(context).toString() == 'Instance of \'_I18n_pt_BR\'') {
I18n.onLocaleChanged(Locale('en', 'US'));
model.changeCurrency('USD');
}
}
@override
bool get wantKeepAlive => true;
@override
Widget build(BuildContext context) {
super.build(context);
print('hi home');
return Scaffold(
...
解决方案
我有一个类似的问题。当我通过给它们一个列表来组织要在 CupertinoTabView 中显示的页面时,这个问题得到了解决。
class _MainTabsState extends State<MainTabs> {
_buildCartButton(index) {
// Some code I do here
}
int index = 0;
final List<Widget> _pages = [
HomePage(),
SearchPage(),
CartPage(),
UserPage()];
@override
Widget build(BuildContext context) {
return CupertinoTabScaffold(
tabBar: CupertinoTabBar(
items: [
BottomNavigationBarItem(
title: Text(I18n.of(context).home, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.home),
),
BottomNavigationBarItem(
title: Text(I18n.of(context).search, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.search),
),
_buildCartButton(index),
BottomNavigationBarItem(
title: Text(I18n.of(context).user, style: TextStyle(fontSize: 12.0)),
icon: Icon(Icons.person),
),
],
activeColor: Colors.orange,
currentIndex: index,
onTap: (ind) {
setState(() {
index = ind;
});
},
),
tabBuilder: (context, i) {
return CupertinoTabView(builder: (context) {
return _pages[i];
});
},
);
}
}
推荐阅读
- firebase - 在不启用 App Engine 的情况下使用 Firestore
- sql - 执行联接后从 SQL Server 中的 XML 中提取信息
- .net - 在 Visual Studio 中调试应用程序时 TTFB 极长
- npm - Stencil e2e 测试在服务器上失败
- python - Flask-SQLAlchemy 设置关系默认值
- swift - FacebookShare 的完成不会通过 Native App 触发
- git - git - 添加标签但排除合并的提交
- php - vue.config.js:未解析的变量或类型模块 => 找不到 php 文件
- spring - 从 java.util.Date 通过 JPA/Hibernate 查询 Oracle DB
- bash - .bashrc 中的最后一个命令退出代码比较