Una barra de aplicaciones consta de una barra de herramientas y, potencialmente, otros widgets, como TabBar y FlexibleSpaceBar. Las barras de aplicaciones generalmente exponen una o más acciones comunes con IconButtons que son seguidas opcionalmente por un PopupMenuButton para operaciones menos comunes (a veces llamado «menú desplagable»).
Las AppBar normalmente se usan en la propiedad Scaffold.appBar, que coloca la barra de aplicaciones como un widget de altura fija en la parte superior de la pantalla.
La AppBar muestra los widgets de barra de herramientas, el inicio (leading), el título (title) y las acciones de la barra de herramientas (actions), sobre la parte inferior (si corresponde). La parte inferior (bottom) se utiliza generalmente para un TabBar. Si se especifica un widget flexibleSpace, entonces se apila detrás de la barra de herramientas y el widget inferior. El siguiente diagrama muestra dónde aparece cada una de estas ranuras en la barra de herramientas cuando el idioma de escritura es de izquierda a derecha:
Si se omite el widget principal(leading), pero la barra de aplicaciones cuenta con un Drawer, se insertará un botón para abrir el cajón (Drawer). De lo contrario, si el navegador más cercano tiene alguna ruta anterior, en su lugar se inserta un BackButton ( ← ). Este comportamiento se puede desactivar configurando automaticamente ImplyLeading en falso. En ese caso, un widget inicial nulo dará como resultado que el widget central / título se extienda para comenzar.
AppBar(
title: Text('Mi app Bar'),
actions: <Widget>[
IconButton(
icon: Icon(Icons.favorite),
tooltip: 'Me gusta',
onPressed: (){ },
),
IconButton(
icon: Icon(Icons.zoom_in),
tooltip: 'Zoom (+)',
onPressed: (){ },
),
IconButton(
icon: Icon(Icons.zoom_out),
tooltip: 'Zoom (-)',
onPressed: (){ },
),
],
)
