1
resposta

Mantendo o empilhamento de telas quando utilizo um BottomNavigationBar

Tenho um projeto que utilizo o componente BottomNavigationBar para criar uma barra de navegação na parte inferior da App, essa barra permite ao usuário escolher qual informação da app ele poderá visualizar. Nesse BottomNavigationBar tenho três páginas que trazem um feed com postagens dos usuários da App, no elemento do meio traz o perfil do usuário logado e no último perfil traz uma tela que permite ao usuário explorar (realizar uma busca) nas informações da App. O código par construir o BottomNavigationBar está a seguir.

Widget buildBottomNavigationBar() {
    return BottomNavigationBar(
      type: BottomNavigationBarType.fixed,
      elevation: 0,
      items: [
        BottomNavigationBarItem(
          title: _indexCurrentPage == 0
              ? textNavigationActive(AppLocalizations.of(context)
                  .translate("home_page_feed_label"))
              : textNavigationDefault(AppLocalizations.of(context)
                  .translate("home_page_feed_label")),
          icon: Image.asset('assets/images/toolbar-feed.png',
              width: MediaQuery.of(context).size.width * .06),
          activeIcon: Image.asset('assets/images/toolbar-feed-active.png',
              width: MediaQuery.of(context).size.width * .06),
        ),
        BottomNavigationBarItem(
          title: _indexCurrentPage == 1
              ? textNavigationActive(AppLocalizations.of(context)
                  .translate("home_page_perfil_label"))
              : textNavigationDefault(AppLocalizations.of(context)
                  .translate("home_page_perfil_label")),
          icon: Image.asset('assets/images/toolbar-perfil.png',
              width: MediaQuery.of(context).size.width * .06),
          activeIcon: Image.asset('assets/images/toolbar-perfil-active.png',
              width: MediaQuery.of(context).size.width * .06),
        ),
        BottomNavigationBarItem(
          title: _indexCurrentPage == 2
              ? textNavigationActive(AppLocalizations.of(context)
                  .translate("home_page_explorar_label"))
              : textNavigationDefault(AppLocalizations.of(context)
                  .translate("home_page_explorar_label")),
          icon: Image.asset('assets/images/toolbar-explorar.png',
              width: MediaQuery.of(context).size.width * .06),
          activeIcon: Image.asset('assets/images/toolbar-explorar-active.png',
              width: MediaQuery.of(context).size.width * .06),
        )
      ],
      onTap: navigationTapped,
      currentIndex: _indexCurrentPage,
    );
  }

A Função navigationTapped faz apenas a troca da página corrente.

void navigationTapped(int page) {
    Util.setBottonNavigationBarIndex(page);
    if (page == 0 && _currentPage.toString() == "FeedPage") {
      _feedController.feedScroll(true);
    } else {
      _feedController.feedScroll(false);
    }

    if (page == 1 && _currentPage.toString() == "ProfilePage") {
      _usuarioController.feedScroll(true);
    } else {
      _usuarioController.feedScroll(false);
    }

    if (page == 2 &&
        _currentPage.toString() == "ProfileAutorPage" &&
        _usuarioController.authorPostShowProfileTab == true) {
      _usuarioController.authorPostShowProfileTab = false;
    } else if (page == 0 &&
        _currentPage.toString() == "ProfileAutorPage" &&
        _usuarioController.authorPostShowProfileTab == false) {}
    _indexCurrentPage = page;
    _pageController.jumpToPage(_indexCurrentPage);
  }

_indexCurrentPage é uma variável do tipo inteiro utilizado para controlar em qual tela o usuário está.

O meu problema é que eu tenho que manter de forma individualizada o controle de empilhamento de telas em cada uma das páginas que compõem o BottomNavigationBar, por que o usuário pode por exemplo detalhar o perfil de outro usuário da app estando na tela de feed, como também pode detalhar esse perfil a partir da tela de explorar. Nas páginas do BottomNavigationBar já estou utilizando o AutomaticKeepAliveClientMixin para manter o estado da página.

Como devo proceder para resolver esse problema?

1 resposta

Oi Fabricio, tudo bem ?

Pensando num geral mesmo cara, se entendi bem, você devia abrir outra tela, independente dessa.

Ou seja, nas próximas telas, não veríamos a bottom navigation bar, digo isso pensando em todos os apps que usam esse pattern.