Costruire l'interfaccia utente con Scaffold e AppBar dentro Flutter

In Flutter, puoi creare un'interfaccia utente semplice ma potente utilizzando Scaffold e AppBar widget. Scaffold fornisce una struttura di base per un'app con elementi comuni come la barra dell'app, il corpo dell'app e i pulsanti di navigazione. AppBar fa parte di Scaffold e contiene il titolo dell'app e le opzioni di navigazione.

Di seguito è riportata una guida su come creare una semplice interfaccia utente utilizzando Scaffold e AppBar:

Crea una nuova Flutter app

Innanzitutto, crea una nuova Flutter app eseguendo il seguente comando in terminal:

flutter create app_name

(Sostituisci app_name con il nome desiderato della tua app).

Modifica il file main.dart

Nel file main.dart(all'interno della cartella lib), sostituisci il contenuto con quanto segue:

import 'package:flutter/material.dart';  
  
void main() {  
  runApp(MyApp());  
}  
  
class MyApp extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return MaterialApp(  
      home: MyHomePage(),  
   );  
  }  
}  
  
class MyHomePage extends StatelessWidget {  
  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      appBar: AppBar(  
        title: Text('Flutter App with Scaffold and AppBar'),  
     ),  
      body: Center(  
        child: Text('Hello, world!'),  
     ),  
   );  
  }  
}  

Nell'esempio sopra, creiamo un'app con Scaffold e AppBar. contiene Scaffold il AppBar e il corpo dell'interfaccia utente passato alla body proprietà.

Esegui l'app

Infine, per eseguire l'app, eseguire il seguente comando in terminal:

flutter run

La tua app visualizzerà una schermata con il titolo " Flutter App con Scaffold e AppBar " sulla barra dell'app e il testo Hello, world!  al centro dello schermo.

Conclusione: Scaffold e AppBar sono due widget essenziali Flutter che ti aiutano a costruire un'interfaccia utente semplice e funzionale. Usandoli, puoi creare app attraenti con componenti dell'interfaccia utente di base come la barra dell'app e il corpo dell'app.