Flutter change AppBottomNavigation body by tapping on button on another state - flutter

Question

I have an AppBottomNavigation for five different states. In the first state, HomeScreen, I have a button. By tapping on this button, the state is to be changed to the third element of the AppBottomNavigation.How exactly can I implement this? I have already tried several times to call the method "bottomTapped" with index 2 via ScannderDummy. Unfortunately without success.
app_bottom_navigation.dart
class AppBottomNavigation extends StatefulWidget {
#override
_AppBottomNavigationState createState() => _AppBottomNavigationState();
}
class _AppBottomNavigationState extends State<AppBottomNavigation> {
int _selectedIndex = 0;
List<dynamic> menuItems = [
...
];
PageController pageController = PageController(
initialPage: 0,
keepPage: true,
);
Widget buildPageView() {
return PageView(
controller: pageController,
onPageChanged: (index) {
pageChanged(index);
},
children: <Widget>[
HomeScreen(),
CategoryScreen(),
ScannerScreen(),
CategoryScreen(),
ProfileSettingsScreen(),
],
);
}
pageChanged(int index) {
setState(() {
_selectedIndex = index;
});
}
bottomTapped(int index) {
setState(() {
_selectedIndex = index;
pageController.jumpToPage(index);
});
}
#override
Widget build(BuildContext context) {
SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
statusBarColor: Colors.transparent,
statusBarIconBrightness: Brightness.dark));
return Scaffold(
bottomNavigationBar: BottomNavigationBar(
backgroundColor: Colors.white,
showUnselectedLabels: true,
unselectedItemColor: Colors.grey,
type: BottomNavigationBarType.fixed,
selectedLabelStyle: GoogleFonts.outfit(
textStyle:
TextStyle(height: 1.5, fontSize: 10, fontWeight: FontWeight.bold),
),
unselectedLabelStyle: GoogleFonts.outfit(
textStyle: TextStyle(
height: 1.5,
fontSize: 10,
),
),
items: menuItems.map((i) {
return BottomNavigationBarItem(
icon: (i['icon']),
activeIcon: (i['icon']),
label: i['label'],
);
}).toList(),
currentIndex: _selectedIndex,
selectedItemColor: primaryColor,
onTap: (index) {
bottomTapped(index);
},
),
body: buildPageView(),
);
}
}
scanner_dummy.dart (Element from home_screen.dart)
class ScannerDummy extends StatelessWidget {
final AppBottomNavigation bn = new AppBottomNavigation();
#override
Widget build(BuildContext context) {
return InkWell(
onTap: () {
},
child: Container(
margin:
EdgeInsets.only(top: 6, bottom: 28.0, left: 28.0, right: 28.0),
padding: EdgeInsets.symmetric(
horizontal: 16.0,
),
height: 125,
width: double.infinity,
decoration: BoxDecoration(
color: darkGrey,
borderRadius: BorderRadius.all(Radius.circular(15)),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Icon(
LineIcons.retroCamera,
color: Colors.white,
size: 35.0,
),
Text(
'Artikel scannen & verkaufen',
textAlign: TextAlign.right,
style: GoogleFonts.outfit(
textStyle: TextStyle(
color: Colors.white,
fontSize: 16,
height: 2,
)),
),
],
)),
);
}
}
Thank you very much for your help.

Answer 1

Play with this widget. I am using callback method.
class ItemB extends StatefulWidget {
final VoidCallback callback;
ItemB({Key? key, required this.callback}) : super(key: key);
#override
State<ItemB> createState() => _ItemBState();
}
class _ItemBState extends State<ItemB> {
#override
Widget build(BuildContext context) {
return Column(
children: [
Text("B"),
ElevatedButton(
onPressed: widget.callback,
child: Text("switch Tab"),
),
],
);
}
}
class HomeWidgetX extends StatefulWidget {
const HomeWidgetX({Key? key}) : super(key: key);
#override
State<HomeWidgetX> createState() => _HomeWidgetXState();
}
class _HomeWidgetXState extends State<HomeWidgetX> {
int currentTab = 0;
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: [
Text("A"),
ItemB(
callback: () {
setState(() {
currentTab = 0;
});
},
)
][currentTab]),
bottomNavigationBar: BottomNavigationBar(
currentIndex: currentTab,
onTap: (value) {
currentTab = value;
setState(() {});
},
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.abc),
label: "",
),
BottomNavigationBarItem(
icon: Icon(Icons.ac_unit),
label: "",
),
],
),
);
}
}