flutter bottom bar change page setstate as default for some pages

Viewed 74

I have a problem with my BottomNavigationBar in Flutter. Please help me with this issue. i really need it to done. I don't want to keep my page alive if I press jump to any page from screens, not from my BottomNavigationBar. eg, if I have three screens that navigate from the bottom bar its works fine but if I add a button in any of the three pages that navigate to another screen that does not belong to the bottom bar then it keeps that screen alive the previous screen.

here my implementation.

enter image description here

BottomNavigation :

footer.dart

import 'package:flutter/material.dart';
import 'MyPage.dart';
import 'MyPage2.dart';
import 'MyPage3.dart';
import 'package:double_back_to_close_app/double_back_to_close_app.dart';
import 'Notifications.dart';

void main() {
runApp(MaterialApp(
home: Footer(),
));
}

class Footer extends StatefulWidget {
@override
 _Footer createState() => _Footer();
}

class _Footer extends State<Footer> {
 late List<Widget> _pages;

  List<BottomNavigationBarItem> _items = [
   BottomNavigationBarItem(
   icon: Icon(Icons.home),
   label: "Home",
  ),
 BottomNavigationBarItem(
   icon: Icon(Icons.messenger_rounded),
   label: "Messages",
 ),
 BottomNavigationBarItem(
  icon: Icon(Icons.settings),
  label: "Settings",
 )
];

late int _selectedPage;

@override
void initState() {
 super.initState();
 _selectedPage = 0;

 _pages = [
  MyPage(
    count: 1,
  ),
  MyPage2(
    count: 2,
  ),
  MyPage3(
    count: 3,
  ),
  // This avoid the other pages to be built unnecessarily
  //Notifications(),
  // SizedBox(),
 ];
 }
 late DateTime currentBackPressTime;
  @override
  Widget build(BuildContext context) {
   return Scaffold(

    body: DoubleBackToCloseApp(
      snackBar: SnackBar(
        content: const Text(
          'Tap back again to leave',
          style: TextStyle(fontSize: 14.0, fontWeight: FontWeight.normal),
        ),
        duration: Duration(seconds: 4),
        backgroundColor: Colors.blue,
        width: 340.0,
        padding: EdgeInsets.all(15),
        behavior: SnackBarBehavior.floating,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0),
        ),
      ),
    child: _pages[_selectedPage],
    ),
  bottomNavigationBar: BottomNavigationBar(
    items: _items,
    currentIndex: _selectedPage,
    onTap: (index) {
      setState(() {
        // now check if the chosen page has already been built
        // if it hasn't, then it still is a SizedBox
        _selectedPage = index;
      });
    },
  )
);
}
}

MyPage.dart:

import 'package:flutter/material.dart';
import 'MyCustomPage.dart';
import 'Notifications.dart';

class MyPage extends StatefulWidget {
 final count;
 MyPage({Key? key, this.count}) : super(key: key);


 @override
 _MyPage createState() => _MyPage();
 }


 class _MyPage extends State<MyPage>{
 @override
  Widget build(BuildContext context) {
  // You'll see that it will only print once
  return Navigator(
   onGenerateRoute: (RouteSettings settings) {
    return MaterialPageRoute(
      builder: (BuildContext context) {
        return Scaffold(
          appBar: AppBar(
            title: Text(this.text),
            actions: <Widget>[
              Row(
                  children: [
                      InkWell(
                        onTap: () {
                          Navigator.of(context).push(MaterialPageRoute(
                              builder: (ctx) => Notifications()));
                        },
                        child: Icon(Icons.notifications),
                      )
                    ],
                  )

            ],
          ),
          body: Center(
            child: RaisedButton(
              child: Text('my page1'),
              onPressed: () {
                Navigator.of(context).push(MaterialPageRoute(
                    builder: (ctx) => MyCustomPage()));
              },
            ),
          ),
        );
      },
    );
  },
);
}
}

MyCustomPage.dart

import 'package:flutter/material.dart';

class MyCustomPage extends StatefulWidget {

 MyCustomPage ({Key? key}) : super(key: key);

@override
_MyCustomPage  createState() => _MyCustomPage();
 }

class _MyCustomPage  extends State<MyCustomPage>{
@override
Widget build(BuildContext parentContext) {
return Scaffold(
  appBar: AppBar(
    title: Text('custompage'),
  ),
  body: Column(
    children: [
      Expanded(
        child: Container(
          child: ListView.builder(
            itemCount: 15,
            itemBuilder: (context, index) {
              return Container(
                width: double.infinity,
                child: Card(
                  child: Center(
                    child: Text('My Custom Page'),
                  ),
                ),
              );
            },
          ),
        ),
      ),
    ],
  ),
);
}
}

Here are my three files that navigate the inner screen the flow of navigation is first load Footer.dart file that is the main file inside there is three pages in BottomNavigationBar() in the first screen on tap home icon it loads MyPage.dart file which contains a text and button. on the button press, it navigates MyCustomPage.dart file. now the issue is when I click on the home icon from BottomNavigationBar() it loads MyPage screen and on press button inside that screen it loads MyCustomPage but when MyCustomPage.dart file load it keeps home icon alive and I don't have access to press the home icon again.

I hope you understand what I am trying to say. If anyone knows please help me.

0 Answers
Related