Flutter GetX with bottom navigation bar not update the widget - flutter

Question

actually, i have fixed this problem. but it is weird implementation. maybe there are better solution for this situation.
so, i have list of screen that will show based of bottom navigation index
List<Widget> screenList = [
HomeScreen(),
KategoriScreen(),
PesananScreen(),
AccountScreen()
];
#override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: false,
body: Obx(() {
var user = Get.find<AccountController>().user.value; // <= weird Solution to trigger update
return screenList.elementAt(_mIndex);
}),
bottomNavigationBar: _bottomNavWidget(),
);
}
one of that Screen have Obx() in the widget. but when data change. the screen not updated. we need to change the screen index then return to that screen to update the widget. so, my current solution is add Obx() in Scaffold that handle the bottom navigation bar logic with useless var (var user). any better solution?
UPDATE
Sorry for the misunderstanding. my problem is when account controller is updated. the screen not updating. need to change other screen and going back. another solution is use Obx() in parent Widget. but the user value is not used

Answer 1

class ScreenController extends GetxController {
var tabIndex = 0;
void changeTabIndex(int index) {
tabIndex = index;
update();
}
}
This was apply to widget Screen page where you can use indexstack
GetBuilder<DashboardController>(
builder: (controller) {
return Scaffold(
body: SafeArea(
child: IndexedStack(
index: controller.tabIndex,
children: [
Home(),
HotDeals(),
ProfilePage(),
],
),
),
bottomNavigationBar: BottomNavigationBar(
unselectedItemColor: Colors.black,
selectedItemColor: Colors.redAccent,
onTap: controller.changeTabIndex,
currentIndex: controller.tabIndex,
showSelectedLabels: true,
showUnselectedLabels: true,
type: BottomNavigationBarType.fixed,
backgroundColor: Colors.white,
elevation: 0,
items: [
_bottomNavigationBarItem(
icon: CupertinoIcons.home,
label: 'Home',
),
_bottomNavigationBarItem(
icon: CupertinoIcons.photo,
label: 'Hotdeals',
),
_bottomNavigationBarItem(
icon: CupertinoIcons.person,
label: 'Profile',
),
],
),
);
},
);

Answer 2

This is the principle of state management. You need to set the state or notify the listeners in order to refresh the UI.
Here, only using Obx is not enough if it is not a controller that you are watching.
I would recommend that you create a class out of your screen list
class ScreenController extends GetxController{
int _selectedIndex = 0.obs;
List<Widget> _screenList = [
HomeScreen(),
KategoriScreen(),
PesananScreen(),
AccountScreen()
];
selectIndex(int index) => selectedIndex = index;
getScreen() => _screenList[_selectedIndex];
}
Then you can simply encapsulate your _selectedIndex inside your Obx widget, that will trigger the refresh when another button uses the selectIndex method.
(You need to put the ScreenController first, as usual)