Menu
I have a TabBarView with 3 TabBar. When I'm in tab 1 I do something, then I navigate to tab 2 when I come back to tab 1 I want to the previous state of tab 1 will not change.
How can I achieve this in Flutter?
Below is my code screenshot
class _LandingPageState extends State<LandingPage> with SingleTickerProviderStateMixin {
int _selectedIndex = 0;
PageController pageController;
TabController tabController;
@override
void initState() {
tabController = TabController(length: 3, vsync: this, initialIndex: 0);
pageController = PageController(initialPage: 0)
..addListener(() {
setState(() {
_selectedIndex = pageController.page.floor();
});
});
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: BottomNavigationBar(
currentIndex: _selectedIndex,
onTap: (index) {
setState(() {
_selectedIndex = index;
tabController.animateTo(index,
duration: Duration(microseconds: 300),
curve: Curves.bounceIn);
});
},
items: [
BottomNavigationBarItem(
icon: Icon(Icons.assignment), title: Text("Các yêu cầu")),
BottomNavigationBarItem(
icon: Icon(Icons.history), title: Text("Lịch sử")),
BottomNavigationBarItem(
icon: Icon(Icons.person), title: Text("Hồ sơ")),
]),
body: TabBarView(
controller: tabController,
children: [
RequestPage(key: PageStorageKey<String>("request_page"),),
HistoryPage(key: PageStorageKey<String>("history_page")),
ProfilePage(key: PageStorageKey<String>("profile_page"))])
),
);
}
772
In case you want to keep the state of your screen in your TabBarView , you can use the mixin class called AutomaticKeepAliveClientMixin in your State class. After that you have to override the wantKeepAlive method and return true . this should be the suggested answer!
TabBar with labels without AppBar Instead, we can use PreferredSize widget. Since TabBar has preferredSize , we should use it to decide the height. Yes!
To create a tab in it, create a tab list and create an object of its TabController. TabController _tabController; Initalize the TabController inside the initState() method and also override it in the dispose() method.
Here’s the minimal code to get TabBar up and running: To implement TabBar in your Flutter app, complete the following steps: Wrap the Scaffold widget inside the DefaultTabController. This should be used for most simple use cases. If you want to control the tabs programmatically, you should use TabController and avoid this step
Either create a TabController manually, or automatically by using a DefaultTabController widget. Using DefaultTabController is the simplest option, since it creates a TabController and makes it available to all descendant widgets. 2. Create the tabs When a tab is selected, it needs to display content. You can create tabs using the TabBar widget.
Using DefaultTabController is the simplest option, since it creates a TabController and makes it available to all descendant widgets. 2. Create the tabs When a tab is selected, it needs to display content. You can create tabs using the TabBar widget. In this example, create a TabBar with three Tab widgets and place it within an AppBar.
Use the TabController to move to the next page with the click of a button: You may want to perform some operations when a specific tab is open. This callback comes in handy when you want to perform initialize something again when a particular tab is open or destroy something when tab is not open.
Make sure that all of your TabBarView children are StatefulWidgets and then add a AutomaticKeepAliveClientMixin like so in all of them, for example, for your RequestPage, it should look like this:
class RequestPage extends StatefulWidget {
RequestPage({Key key}) : super(key: key);
@override
_RequestPageState createState() => _RequestPageState();
}
class _RequestPageState extends State<RequestPage> with AutomaticKeepAliveClientMixin{
@override
Widget build(BuildContext context) {
super.build(context);
return // Your widget tree
}
@override
bool get wantKeepAlive => true;
}
Try AutomaticKeepAliveClientMixin and override wantKeepAlive to always return true
1
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
