Aplicacions amb Flutter, Dart i Flame

Barra de l'aplicació

La barra de l'aplicació és un element que es situa a la part superior de la pantalla i serveix per mostrar elements de caire general. Hi pot haver, per exemple, un títol i un conjunt de botons. També podem definir-li el color de fons i el color amb el que es mostraran el text i les icones.

...
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.brown,
          foregroundColor: Colors.white,
          title: Text("Aplicació de prova"),
          actions: [
            IconButton(onPressed: () {}, icon: Icon(Icons.access_alarm)),
            IconButton(onPressed: () {}, icon: Icon(Icons.search)),
          ],
        ),
      ),
    );
  }
...

Al web de Flutter podem trobar una llarga llista d'icones disponibles.

Fixem-nos que quan creem una aplicació buida la línia del return ens queda així:

...
    return const MaterialApp(
...

Si volem posar una barra de l'aplicació, és necessari eliminar el const.

Per posar una icona a l'esquerra del títol, cap posar més instruccions. Per exemple:

...
    return Scaffold(
      appBar: AppBar(
        leading: Builder(builder: (BuildContext context){
          return IconButton(
            onPressed: () {
              setState(() {resultats = false;});}, 
            icon: Icon(Icons.arrow_back)),
          );
        }),
        title: Text(resultats ? "Color triat" : "Tria un color"),
        backgroundColor: ColorsApp.primari,
        foregroundColor: ColorsApp.text,
      ),
...

Aquesta obra d'Oriol Boix està llicenciada sota una llicència no importada Reconeixement-NoComercial-SenseObraDerivada 3.0.