各アイコンをクリックすると3つの異なるページにルーティングされるbottomnavigationbarのあるページがあります。私のコードは正常に動作しますが、あるページから別のページにルーティングするときにボトムナビゲーションを固定したいです。以下は私のコードです:
class Home extends StatefulWidget {
@override
_HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
int currentTab = 0;
final List<Widget> screens = [
DealActivity(),
FinalLoginPage(),
ProfilePageUsers(),
];
final PageStorageBucket bucket = PageStorageBucket();
Widget currentScreen = DealActivity(); // Our first view in viewport
@override
Widget build(BuildContext context) {
const assetHome = 'assets/home_off.svg';
const assetRedemptions = 'assets/redeemed_off.svg';
const assetProfile = 'assets/profile_off.svg';
const assetHome1 = 'assets/home_on.svg';
const assetRedemptions1 = 'assets/redeemed_on.svg';
const assetProfile1 = 'assets/profile_on.svg';
return Scaffold(
extendBody: true,
body: PageStorage(
child: currentScreen,
bucket: bucket,
),
bottomNavigationBar: BottomAppBar(
color: colorGreen,
child: Container(
height: 45,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
MaterialButton(
minWidth: 5,
onPressed: () {
setState(() {
currentScreen = DealActivity();
; // if user taps on this dashboard tab will be active
currentTab = 0;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.all(1.0),
child: currentTab == 0 ? SvgPicture.asset(assetHome1,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Home'):SvgPicture.asset(assetHome,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Home'),
),
],
),
),
MaterialButton(
minWidth: 5,
onPressed: () async{
setState(() {
currentScreen =_email == "" ?RedemptionPage():FinalLoginPage(); // if user taps on this dashboard tab will be active
currentTab = 2;
});
SharedPreferences prefs =
await SharedPreferences.getInstance();
prefs.setInt('currentTab', currentTab);
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.all(1.0),
child: currentTab == 2 ? SvgPicture.asset(assetRedemptions1,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Redemptions'):SvgPicture.asset(assetRedemptions,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Redemptions'),
),
],
),
),
MaterialButton(
minWidth: 5,
onPressed: () {
setState(() {
currentScreen = _email == ""
? ProfilePage()
: ProfilePageUsers(); // if user taps on this dashboard tab will be active
currentTab = 3;
});
},
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.all(1.0),
child: currentTab == 3 ? SvgPicture.asset(assetProfile1,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Profile'):SvgPicture.asset(assetProfile,
color: Colors.white,
width: 20,
height: 20,
semanticsLabel: 'Profile'),
),
],
),
),
],
),
),
),
);
}
}
たとえば、DealActivity() をクリックし、DealActivity から別のページに移動した場合、下部のナビゲーションを下部に固定し、DealActivity のあるページから別のページに移動すると、DealActivity アイコンがアクティブなまま表示されるようにします。また、FinalLoginPage() にいて、その中で別のページに移動した場合、下部のナビゲーションはそのアイコンをアクティブにしたままにする必要があります。同じことが ProfilePageUsers() にも当てはまります。これを達成するための助けに本当に感謝します。