как использовать Navigator в случае использования BottomNavigationBar?

Question

Использую BottomNavigationBar:

 final screens = [
    ActiveOrders(),
    OrdersOnMap(),
    CompletedOrders(),
    OperatorsPage()
  ];
  final screensTitle = [
    'Активные заказы',
    'Карта активных заказов',
    'Выполненные заказы',
    'Операторы'
  ];

BottomNavigationBar(
        elevation: 10.0,
        currentIndex: _currentIndex,
        backgroundColor: Colors.white,
        selectedItemColor: Colors.orange,
        unselectedItemColor: Colors.grey,
        items: [
          BottomNavigationBarItem(
              icon: Icon(Icons.settings_input_component),
              backgroundColor: Colors.white,
              title: Text('Заказы')),
          BottomNavigationBarItem(
              icon: Icon(Icons.map),
              backgroundColor: Colors.white,
              title: Text('Карта')),
          BottomNavigationBarItem(
              icon: Icon(Icons.local_offer),
              backgroundColor: Colors.white,
              title: Text('Выполнены')),
          BottomNavigationBarItem(
              icon: Icon(Icons.phone_in_talk),
              backgroundColor: Colors.white,
              title: Text('Операторы')),
        ],
        onTap: (index) {
          setState(() {
            _currentIndex = index;
          });
        },
      )

на первом экране использую ListView.buider при нажатии на элемент из этого списка использую Navigator.push, но дело в том что таким образом переход осуществляется полностью, а мне нужен такой переход чтобы при нажатии менялся только внутренний экран BottomNavigationBar а сам BottomNavigationBar оставался, как это сделать?

надеюсь я правильно объяснил...

Answer 1

Так?

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  int _currentIndex = 0;

  List<Screens> screens = [
    Screens(ActiveOrders(), 'Активные заказы'),
    Screens(OrdersOnMap(), 'Карта активных заказов'),
    Screens(CompletedOrders(), 'Выполненные заказы'),
    Screens(OperatorsPage(), 'Операторы'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: screens[_currentIndex].screen,
        bottomNavigationBar: BottomNavigationBar(
          elevation: 10.0,
          currentIndex: _currentIndex,
          backgroundColor: Colors.white,
          selectedItemColor: Colors.orange,
          unselectedItemColor: Colors.grey,
          items: [
            BottomNavigationBarItem(
                icon: Icon(Icons.settings_input_component),
                backgroundColor: Colors.white,
                title: Text(screens[_currentIndex].name)),
            BottomNavigationBarItem(
                icon: Icon(Icons.map),
                backgroundColor: Colors.white,
                title: Text(screens[_currentIndex].name)),
            BottomNavigationBarItem(
                icon: Icon(Icons.local_offer),
                backgroundColor: Colors.white,
                title: Text(screens[_currentIndex].name)),
            BottomNavigationBarItem(
                icon: Icon(Icons.phone_in_talk),
                backgroundColor: Colors.white,
                title: Text(screens[_currentIndex].name)),
          ],
          onTap: (index) {
            setState(() {
              _currentIndex = index;
            });
          },
        ));
  }
}

class Screens {
  final Widget screen;
  final String name;

  Screens(this.screen, this.name);
}

БЛОГ НА HUSL

как использовать Navigator в случае использования BottomNavigationBar?

Ответы (1 шт):