¿Qué son los Widgets en Flutter?

Tabla de contenidos

• Características de los Widgets en Flutter
• Ejemplos y aplicaciones en código
  • Descripción de los widgets utilizados: 

Flutter en sí es el conjunto de herramientas de interfaz de usuario de Google para crear hermosas aplicaciones iOS y Android compiladas de forma nativa a partir de una única base de código. Para construir cualquier aplicación, comenzamos con widgets: el componente básico de las aplicaciones de flutter. Los widgets describen cómo debería verse su vista dada su configuración y estado actual. Incluye un widget de texto(text), un widget de fila(row), un widget de columna(column), un widget de contenedor(container) y muchos más. 

Widgets: cada elemento en una pantalla de la aplicación Flutter es un widget. La vista de la pantalla depende completamente de la elección y secuencia de los widgets usados ​​para construir la aplicación. Y la estructura del código de una aplicación es un árbol de widgets. 

Características de los Widgets en Flutter

Categoría de widgets: hay principalmente 14 categorías en las que se dividen los widgets. Se segregan principalmente sobre la base de la funcionalidad que proporcionan en una aplicación de flutter.

1. Accessibility: este es el conjunto de widgets que hacen que una aplicación Flutter sea más accesible.
2. Animation and Motion: estos widgets agregan animación a otros widgets.
3. Assets, Images, and Icons: estos widgets se encargan de activos como mostrar imágenes e iconos.
4. Async: estos proporcionan funcionalidad async en la aplicación Flutter.
5. Basics: este es el conjunto de widgets que son absolutamente necesarios para el desarrollo de cualquier aplicación de flutter.
6. Cupertino: Estos son los widgets diseñados por ios.
7. Input: este conjunto de widgets proporciona funcionalidad de entrada en una aplicación Flutter.
8. Interaction Models: estos widgets están aquí para administrar eventos táctiles y enrutar a los usuarios a diferentes vistas en la aplicación.
9.  Layout: este paquete de widgets ayuda a colocar los otros widgets en la pantalla según sea necesario.
10. Material Components: este es un conjunto de widgets que siguen principalmente el diseño de materiales de Google.
11. Painting and effects: este es el conjunto de widgets que aplican cambios visuales a sus widgets secundarios sin cambiar su diseño o forma.
12. Scrolling: esto proporciona sacrificabilidad de un conjunto de otros widgets que no son desplazables por defecto.
13. Styling: se ocupa del tema, la capacidad de respuesta y el tamaño de la aplicación.
14. Text: este texto de visualización.

Tipos de widgets: hay dos tipos de widgets en Flutter: 

1. Widget sin estado
2. Widget con estado

Ejemplos y aplicaciones en código

Ejemplo: el árbol de diseño de la pantalla de la aplicación básica: 

import 'package:flutter/material.dart';

void main() => runApp(FirstTest());

class FirstTest extends StatelessWidget {
@override
Widget build(BuildContext context) {
	return MaterialApp(home: Scaffold(backgroundColor: Colors.lightGreen,
									appBar: AppBar(backgroundColor: Colors.green,
									title: Text("BigCode"),),
										
body: Container(child: Center(child: Text("Hello!!"),),),),);}}

Descripción de los widgets utilizados:

• Scaffold: implementa la estructura de disposición visual básica del diseño de materiales.
• AppBar: para crear una barra en la parte superior de la pantalla.
• Text: para escribir cualquier cosa en la pantalla.
• Container: para contener cualquier widget.
• Center: para proporcionar una alineación central a otros widgets.

Fuente del artículo, página What is widgets in Flutter

• 
  Iteradores y generadores en TypeScript
• 
  Símbolo en TypeScript (Symbol)
• 
  Tipos Avanzados en TypeScript
• 
  Tipos de Compatibilidad en TypeScript
• 
  Inferir Tipos en TypeScript
• 
  Tipos Generalizados (Generics) en TypeScript
• 
  Tipos Básicos de Datos en TypeScript
• 
  Interfaces en TypeScript
• 
  Declaración de Variables en TypeScript
• 
  Funciones en TypeScript
• 
  Categorías en TypeScript
• 
  Introducción a TypeScript
• 
  Clase MaterialApp en Flutter
• 
  Clase Container en Flutter
• ¿Qué son los Widgets en Flutter?
• 
  Introducción a la Arquitectura de Aplicaciones con Flutter
• 
  Lista Doblemente Enlazada
• 
  Listas Vinculadas en Estructura de Datos
• 
  Introducción a las Matrices(Arrays)
• 
  Estructuras de Datos en los Algoritmos de Programación
• 
  Expresión const en JavaScript
• 
  Expresión let en JavaScript
• 
  Introducción al Lenguaje de Programación CSS
• 
  Expresión var en JavaScript
• 
  Expresión try…catch en JavaScript
• 
  Expresión throw en JavaScript
• 
  Continue en JavaScript
• 
  Switch en JavaScript
• 
  Expresiones if…else en JavaScript
• 
  Declaración vacía o empty en JavaScript
• 
  Break en JavaScript
• 
  Sentencia block en JavaScript
• 
  Arguments en JavaScript
• 
  Promise en JavaScript
• 
  Number en JavaScript
• 
  Características JSON en JavaScript
• 
  Array en JavaScript
• 
  RegExp en JavaScript
• 
  String en JavaScript
• 
  Date en JavaScript
• 
  Math en JavaScript
• 
  URIError en JavaScript
• 
  TypeError en JavaScript
• 
  SyntaxError en JavaScript