'how to create navigation for bottom_bar_with_sheet 2.1.0 plugin with mobx?

I don't know how to do navigation bringing dynamic data. This is my current code.

import 'package:bottom_bar_with_sheet/bottom_bar_with_sheet.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(MyApp());


class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        iconTheme: IconThemeData(
          color: Colors.blue,
        ),
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}


class _MyHomePageState extends State<MyHomePage> {
  final _bottomBarController = BottomBarWithSheetController(initialIndex: -1);
  int selectedPosition = 4;
  int _selectedIndex = -1;


  @override
  void initState() {
    _bottomBarController.itemsStream.listen((i) {
      if( i < 4 )
      {
        setState(() {
          selectedPosition = -1;
          _selectedIndex = i;
        });
      }

here would trigger the click of quick accesses, notes, profile, settings and alerts by BottomBarWithSheetItem

      switch(i)
      {
      // case "HOME" :  FutureBuilder: Navigator.pushReplacement(context, MaterialPageRoute(builder: (context)=> Home())); break;
        case 0: print("Acesso rápido 0");break;
        case 1: print("Acesso rápido 1");break;
        case 2: print("Acesso rápido 2");break;
        case 3: print("Acesso rápido 3");break;
      }
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blue,
      body: Center(
        child: Text(
          "Criar navegacao aqui",
          style: TextStyle(
            color: Colors.white,
            fontSize: 20,
            fontWeight: FontWeight.w900,
          ),
        ),
      ),
      bottomNavigationBar: BottomBarWithSheet(
        selectedIndex:_selectedIndex,
        controller: _bottomBarController,
        bottomBarTheme: BottomBarTheme(
          mainButtonPosition: MainButtonPosition.middle, // posicao do botao de 'mais -> (+)'
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.vertical(top: Radius.circular(25)),
          ),
          itemIconColor: Colors.grey,
          itemTextStyle: TextStyle(
            color: Colors.grey,
            fontSize: 10.0,
          ),
          selectedItemTextStyle: TextStyle(
            color: Colors.blue,
            fontSize: 10.0,
          ),
        ),
        onSelectItem: (index) {
          setState(() {
            _selectedIndex = index;
          });
        },
        sheetChild: Padding(
          padding: EdgeInsets.only(top:10,bottom:6),
          child:Column(
            children: <Widget>[
              Divider(
                height: 10,
                thickness: 2,
                color: Colors.blue,
                indent: 0,
              ),
              Expanded(
                child: GridView.count(
                  physics: NeverScrollableScrollPhysics(), //kill scrollable
                  // shrinkWrap: true,
                  crossAxisCount: 4,
                  children: <Widget>[
                    _createBottomBarSheetChild(context, 'Home', Icons.api_sharp, _routeMenu, 4),
                    _createBottomBarSheetChild(context, 'Produto', Icons.apartment, _routeMenu, 5),
                    _createBottomBarSheetChild(context, 'Cliente', Icons.person, _routeMenu, 6),
                    _createBottomBarSheetChild(context, 'Proposta', Icons.account_balance_wallet_outlined, _routeMenu, 7),
                  ],
                ),
              ),
              Expanded(
                child: GridView.count(
                  physics: NeverScrollableScrollPhysics(), //kill scrollable
                  // shrinkWrap: true,
                  crossAxisCount: 4,
                  children: <Widget>[
                    _createBottomBarSheetChild(context, 'Reservas', Icons.add_location_rounded, _routeMenu, 8),
                    _createBottomBarSheetChild(context, 'Unidade', Icons.workspaces_filled, _routeMenu, 9),
                    _createBottomBarSheetChild(context, 'Contratos', Icons.work, _routeMenu, 10),
                    _createBottomBarSheetChild(context, 'Tarefas', Icons.calendar_today, _routeMenu, 11),
                  ],
                ),
              ),
            ],
          ),
        ),
        items: [
          BottomBarWithSheetItem(label: "Notas",icon: Icons.notes),
          BottomBarWithSheetItem(label: "Perfil",icon: Icons.account_circle),
          BottomBarWithSheetItem(label: "Configurações",icon: Icons.settings),
          BottomBarWithSheetItem(label: "Alertas",icon: Icons.add_alert),
        ],
      ),
    );
  }

  @override
  Widget _createBottomBarSheetChild(BuildContext context, String name, IconData icon, Function action, posicao)
  {
    return GestureDetector(
      child: Card(
        elevation: 0,
        margin: EdgeInsets.only(
            left: 3.0,
            top: 25,
            right: 3.0
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Icon(
              icon,
              size: 26,
              color: selectedPosition == posicao ? Colors.blue : Colors.grey,
            ),
            Container(
              margin: EdgeInsets.only(top: 4, bottom: 6, ),
              child: Column(
                children: [
                  Text(
                    name,
                    // textAlign: TextAlign.center,
                    style: TextStyle(
                      color: selectedPosition == posicao ?
                      Colors.blue :
                      Colors.grey,
                    ),
                  ),
                  Divider(
                    height: 16,
                    thickness: 2,
                    color: selectedPosition == posicao ? Colors.blue : Colors.grey,
                    indent: 30,
                    endIndent:30
                  ),
                ],
              )
            ),
          ],
        ),
      ),

      onTap: () {
        // Navigator.pop(context);
        setState(() {
          selectedPosition = posicao;
          _bottomBarController.selectItem(posicao);

        });

        Navigator.of(context);
        action(context, name, posicao);
      },
    );
  }

here would trigger the click of the hidden buttons, such as product, home in the _createBottomBarSheetChild function

  _routeMenu(context, rota, posicao)
  {
    print("rota ${rota.toUpperCase()}");

    switch(rota.toUpperCase())
    {
      case "HOME" :""; posicao = 5;break;
      case "PRODUTO":"";posicao = 6;break;
      case "CLIENTE": "";posicao = 7; break;
      case "PROPOSTA": "";posicao = 8; break;
      case "RESERVA": "";posicao = 9;  break;
      case "UNIDADE": "";posicao = 10; break;
      case "NOVIDADE": "";posicao = 11; break;
      case "TAREFAS": "";posicao = 12; break;
    }
  }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source