0

私が持っているすべてのビューにBottomNavigationBarを表示しようとしていますが、それは機能していますが、これはそれを行うための「ばかげた」方法です...

すべてのビューに挿入するカスタム BottomNavigationBar があります。

var selectedIndex = 0;
class CustomBottombar extends StatefulWidget {
  CustomBottombar({Key key}) : super(key: key);
  @override
  _CustomBottombarState createState() => _CustomBottombarState();
}

class _CustomBottombarState extends State<CustomBottombar> {
  List _viewList = [FirstView(), SecondView()];
  @override
  Widget build(BuildContext context) {
    return BottomNavigationBar(
      currentIndex: selectedIndex,
      onTap: _onItemTapped,
       items: _items,
    );
  }

  void _onItemTapped(int index) {
    setState(() {
      selectedIndex = index;
      Navigator.of(context).popUntil((route) => route.isFirst
      );
      Navigator.pushReplacement(
              context,
              MaterialPageRoute(builder: (context) => _viewList[index]),
            );
    });
  }
  final _items = [
BottomNavigationBarItem(
            icon: Icon(
              Icons.refresh,
              color: Color(0xFFACACAC),
              size: 35,
            ),
            title: Text("first")),
BottomNavigationBarItem(
          icon: Icon(
            Icons.phone,
            color: Color(0xFFACACAC),
            size: 35,
          ),
          title: Text("second"),
        ),
BottomNavigationBarItem(
          icon: Icon(
            Icons.add_shopping_cart,
            color: Color(0xFFACACAC),
            size: 35,
          ),
          title: Text("thrid"),
        ),

]; }

_onItemTapped 関数では、「Navigationstack」からすべてをポップしてから、アイテムにある画面を表示しています。

私の FirstView() には、このコードがあります

class FirstView extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar(""),
      bottomNavigationBar: CustomBottombar(),
      endDrawer: CustomDrawer(),
      body: Center(
        child: RaisedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(builder: (context) => ContactView()),
            );
          },
          child: Text('First'),
        ),
      ),
    );
  }
}

BottomNavigationBar の項目ではない「ContactView」に移動したい

class ContactState extends State<ContactView> {
@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar("title"),
      endDrawer: CustomDrawer(),
      bottomNavigationBar: CustomBottombar(),
      body: SafeArea(
          bottom: true,
          child: SingleChildScrollView(
            child: Container(child: Text("Contact"),),
          )),
    );
  }
}

また、アイテム配列にない他の多くのビューがありますが、BottomNavigationBar を表示したいと考えています。私の問題は本当にこの機能です。

void _onItemTapped(int index) {
        setState(() {
          selectedIndex = index;
          Navigator.of(context).popUntil((route) => route.isFirst
          );
          Navigator.pushReplacement(
                  context,
                  MaterialPageRoute(builder: (context) => _viewList[index]),
                );
        });
      }

ここでは、アイテム配列にあるビューを表示するためにナビゲーション履歴を削除しているためです。これを行う標準的な方法はありますか、うまくいけば、誰かが助けてくれます。

編集: 明確にするために:私は10個のスクリーンを持っています。BottomNavigationBar を介してナビゲートできるのはそのうちの 3 つだけです。10 個のうち最初の 3 個としましょう。今、Screen1 から Screen4 に移動したいと考えています。screen4 でナビゲーションバーが消えます。すべての画面でナビゲーションバーを維持したい。

編集 2

@Dhaval Kansaraの回答はうまくいきましたが、新しい問題が発生しました。修正前は BottomNavigationBar の上にあり、BottomNavigationBar が上になりました。

ここに画像の説明を入力

しかし、私はこのようにしたい

ここに画像の説明を入力

4

1 に答える 1