En Flutter, puede crear una interfaz de usuario simple pero poderosa usando Scaffold y AppBar widgets. Scaffold proporciona una estructura básica para una aplicación con elementos comunes como la barra de la aplicación, el cuerpo de la aplicación y los botones de navegación. AppBar es parte Scaffold y contiene el título de la aplicación y las opciones de navegación.
A continuación se muestra una guía sobre cómo construir una interfaz de usuario simple usando Scaffold y AppBar:
Crear una nueva Flutter aplicación
Primero, cree una nueva Flutter aplicación ejecutando el siguiente comando en terminal:
flutter create app_name
(Reemplace app_name
con el nombre deseado de su aplicación).
Edite el archivo main.dart
En el archivo main.dart(dentro de la carpeta lib), reemplace el contenido con lo siguiente:
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!'),
),
);
}
}
En el ejemplo anterior, creamos una aplicación con Scaffold y AppBar. contiene Scaffold el AppBar y el cuerpo de la interfaz de usuario pasado a la body
propiedad.
Ejecute la aplicación
Finalmente, para ejecutar la aplicación, ejecute el siguiente comando en el terminal:
flutter run
Su aplicación mostrará una pantalla con el título " Flutter Aplicación con Scaffold y AppBar " en la barra de la aplicación y el texto Hello, world!
en el centro de la pantalla.
Conclusión: Scaffold y AppBar son dos widgets esenciales Flutter que te ayudan a construir una interfaz de usuario simple y funcional. Al usarlos, puede crear aplicaciones atractivas con componentes básicos de la interfaz de usuario, como la barra de la aplicación y el cuerpo de la aplicación.