es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

  • es.davy.ai/
  • Programación /
  • Cómo llevar al usuario a una página diferente al utilizar AutoTabsScaffold y BottomNavigationBar?

Cómo llevar al usuario a una página diferente al utilizar AutoTabsScaffold y BottomNavigationBar?

28 Jul, 2023 Programación

Estoy usando Auto_Route para el enrutamiento en mi aplicación y AutoTabsScaffold lo hace más fácil. Pero por defecto, el usuario es dirigido a la primera página en la barra de navegación inferior, pero quiero que sea dirigido a la tercera página por defecto. ¿Cómo puedo hacer eso?

Aquí tienes un fragmento de código:

AutoTabsScaffold(
routes: [
A(),
B(),
C(),
D(),
E(),
],
bottomNavigationBuilder: (_, tabsRouter) {
return BottomNavigationBar(
type: BottomNavigationBarType.fixed,
backgroundColor: Colors.black,
selectedItemColor: const Color(0XFFEAF8FF),
unselectedItemColor: Colors.grey,
currentIndex: tabsRouter.activeIndex,
onTap: tabsRouter.setActiveIndex,
items: const [
BottomNavigationBarItem(
icon: Icon(Icons.groups_outlined), label: “”),
BottomNavigationBarItem(icon: Icon(Icons.search), label: “”),
BottomNavigationBarItem(
icon: Icon(Icons.catching_pokemon), label: “”),
BottomNavigationBarItem(
icon: Icon(Icons.library_add_check_outlined), label: “”),
BottomNavigationBarItem(
icon: Icon(Icons.person_outline), label: “”),
],
);
},
)

Quiero que el usuario aterrice en C() y no en A(). ¿Cómo puedo hacer eso? Gracias de antemano.

Tags:  ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para guiar al usuario a la tercera página de forma predeterminada, debes agregar un parámetro adicional initialIndex al AutoTabsScaffold y establecerlo en el índice de la página a la que deseas navegar. En este caso, debería ser 2 ya que la indexación comienza desde 0.

    Aquí tienes el código actualizado:

    AutoTabsScaffold(
  routes: [
    A(),
    B(),
    C(),
    D(),
    E(),
  ],
  bottomNavigationBuilder: (_, tabsRouter) {
    return BottomNavigationBar(
      type: BottomNavigationBarType.fixed,
      backgroundColor: Colors.black,
      selectedItemColor: const Color(0XFFEAF8FF),
      unselectedItemColor: Colors.grey,
      currentIndex: tabsRouter.activeIndex,
      onTap: tabsRouter.setActiveIndex,
      items: const [
        BottomNavigationBarItem(
            icon: Icon(Icons.groups_outlined), label: ""),
        BottomNavigationBarItem(icon: Icon(Icons.search), label: ""),
        BottomNavigationBarItem(
            icon: Icon(Icons.catching_pokemon), label: ""),
        BottomNavigationBarItem(
            icon: Icon(Icons.library_add_check_outlined), label: ""),
        BottomNavigationBarItem(
            icon: Icon(Icons.person_outline), label: ""),
      ],
    );
  },
  initialIndex: 2, // Establecer el índice inicial en C(),
);

    Con esta modificación, el usuario ahora será dirigido a la tercera página (es decir, C()) de forma predeterminada.

Comments are closed.