Aplicacions amb Flutter, Dart i Flame

Tutorial Flutter Flame Projectes   Recursos CITCEA
Exemples Dart Dades pràctiques     Inici

Carreguem les dades a l'inici

En l'aplicació que teníem fins ara, la pantalla principal estava quasi buida (només hi havia un text) fins que, en prémer el botó, es carregaven les dades. Podem fer que les dades es carreguin automàticament quan es carrega la pàgina. Per fer-ho, només cal sobrescriure el mètode initState i fer que també executi la funció llegirDades. La pantalla principal quedaria així:

pant_principal.dart
import 'package:flutter/material.dart';
import 'package:sheets/data/crida_dades.dart';
import 'package:sheets/data/dades_rebudes.dart';
class PantPrincipal extends StatefulWidget {
  const PantPrincipal({super.key});

  @override
  State<PantPrincipal> createState() => _PantPrincipalState();
}

class _PantPrincipalState extends State<PantPrincipal> {
  Future<DadesRebudes?>? _rebut;
  CridaDades cridaDades = CridaDades();

  @override
  void initState() {
    super.initState();
    _rebut = cridaDades.llegirDades();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Valors actuals"),),
      body: Column(
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: TextButton(
              onPressed: () {
                setState(() {
                  _rebut = cridaDades.llegirDades();
                });
              },
              child: Text("Recarrega"),
            ),
          ),
          FutureBuilder(future: _rebut, builder: (context, snapshot){
            if(snapshot.connectionState == ConnectionState.waiting){
              return CircularProgressIndicator();
            } else if(snapshot.hasError){
              return Text("Error: ${snapshot.error}");
            } else if(snapshot.hasData){
              return escriuResultats(snapshot.data);
            } else {
              return Text("No s'han trobat resultats");
            }
          })
        ],
      ),
    );
  }
}

Widget escriuResultats(DadesRebudes? dades){
  if(dades != null){
    if(dades.nom.length >=5){
      List<Widget> esquerra = [];
      List<Widget> dreta = [];
      Widget element;
      for(int i = 0; i < dades.nom.length; i++){
        element = Text("${dades.nom[i]}:      ");
        esquerra.add(element);
        element = Text("${dades.darrer[i].replaceAll('.', ',')} ${dades.unitats[i]}");
        dreta.add(element);
      }
      return Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          children: [
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: esquerra,
            ),
            Column(
              crossAxisAlignment: CrossAxisAlignment.end,
              children: dreta,
            ),
          ]
        ),
      );
    }
  }
  return Text("Dades incompletes");
}

Ara tenim l'opció de mantenir el botó o fer-lo desaparèixer. Atès que les dades poden anar variant, hem optat per mantenir el botó però canviar-li el text.

 

 

 

 

 

 

 

 

 

 

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