🧭 Navegación co deseño Material 3

NavigationBar é a alternativa recomendada a BottomNavigationBar para Material 3. O funcionamento é parecido: cambia o nome dalgúns parámetros e usa NavigationDestination para cada opción.

No exemplo da barra inferior, podemos substituír o valor de bottomNavigationBar por:

NavigationBar(
  selectedIndex: _indiceActual,
  onDestinationSelected: seleccionar, // Recibe o índice escollido.
  destinations: const [
    NavigationDestination(icon: Icon(Icons.home), label: 'Centro'),
    NavigationDestination(icon: Icon(Icons.person), label: 'Perfil'),
  ],
)

NavigationDrawer ofrece tamén un menú lateral co deseño Material 3. NavigationRail coloca a navegación nunha columna lateral, útil en pantallas anchas.

📚 Consulta:

• NavigationBar → https://api.flutter.dev/flutter/material/NavigationBar-class.html.

📚 Consulta:

• NavigationDrawer → https://api.flutter.dev/flutter/material/NavigationDrawer-class.html.

📚 Consulta:

• NavigationRail → https://api.flutter.dev/flutter/material/NavigationRail-class.html.

📌 Conservar as seccións con IndexedStack

IndexedStack mantén os fillos na árbore e só mostra o indicado por index. Pode resultar útil para conservar o estado das seccións, a cambio de manter os seus widgets en memoria.

📚 Consulta:

• IndexedStack → https://api.flutter.dev/flutter/widgets/IndexedStack-class.html.

🛠️ Acceder a ScaffoldState

Scaffold.of(context) busca o Scaffold que está por riba dese contexto. Permite, por exemplo, abrir o menú con openDrawer ou mostrar un panel con showBottomSheet.

O contexto do método que está a crear ese mesmo Scaffold aínda non está debaixo del. Para obter un contexto interior podemos usar un widget fillo ou Builder.

📚 Consulta:

• Scaffold.of → https://api.flutter.dev/flutter/material/Scaffold/of.html.

⌨️ Adaptar o contido ao teclado

resizeToAvoidBottomInset controla se Scaffold reduce o espazo do corpo cando aparece o teclado. Normalmente convén manter o comportamento por defecto e permitir desprazamento no formulario.

🧱 Máis opcións da estrutura

• BottomAppBar: barra inferior para accións; pode deixar unha abertura para o botón flotante.
• persistentFooterButtons: botóns persistentes na zona inferior.
• MaterialBanner: aviso situado na parte superior, xestionado tamén por ScaffoldMessenger.
• AppBar.bottom: permite engadir, por exemplo, unha TabBar de pestanas.
• extendBody e extendBodyBehindAppBar: deixan que o corpo se debuxe detrás das barras; hai que coidar que o contido non quede tapado.

📚 Consulta:

• Scaffold → https://api.flutter.dev/flutter/material/Scaffold-class.html.

📚 Consulta:

• AppBar → https://api.flutter.dev/flutter/material/AppBar-class.html.

📚 Consulta:

• BottomAppBar → https://api.flutter.dev/flutter/material/BottomAppBar-class.html.

📚 Consulta:

• MaterialBanner → https://api.flutter.dev/flutter/material/MaterialBanner-class.html.