24/4/2020 Tipos de Arquitecturas para Flutter en Curso Avanzado de Flutter

4.428 pts Menú

Curso Avanzado de Flutter

Artículo
Tipos de Arquitecturas para Flutter
anncode  14 de Mayo de 2019

Vanilla

En esta arquitectura la lógica y la vista se colocan en el Widget. Su principal bene cio es que es
1
simple y autónoma. Conectado en cualquier parte de tu aplicación, recuperará y renderizará
datos.
2

Por otro lado, escribir widgets de esta manera puede generar caos en el documento de vista de
3 la app, sobre todo cuando la lógica empieza a extenderse a bifurcarse o es más avanzado.

4
Widget _buildInit() {
return Center(
5 child: RaisedButton(
child: const Text('Load user data'),
onPressed: () {
6
setState(() {
_isLoading = true;
7 });    Arquitectura BLoC en Flutter
widget._repository.getUser().then((user) {
https://platzi.com/clases/1603-flutter-avanzado/20219-tipos-de-arquitecturas-para-flutter/ 1/7
24/4/2020 Tipos de Arquitecturas para Flutter en Curso Avanzado de Flutter

8 setState(() {
_user = user;
_isLoading = false;
9 });
});
10
},
),
);
}

No te recomiendo mucho usar este tipo de Arquitectura pues aunque es fácil de aprender en
realidad rómpe con uno de los principios SOLID que deben seguir todas las arquitecturas.
Single Responsability la cuál dice que una clase debe tener solo una responsabilidad. En este
caso la vista y el controlador son dos responsabilidades que están cayendo en la misma clase.

Scoped Model

Este es una librería de terceros Puedes encontrar toda la información aquí que no está incluída.
Es extraída del código base del Sistema operativo Fuchsia.

Widget _buildInit(UserModel userModel) {

return Center(
child: RaisedButton(
child: const Text('Load user data'),
onPressed: () {
userModel.loadUserData();
},
),    Arquitectura BLoC en Flutter

https://platzi.com/clases/1603-flutter-avanzado/20219-tipos-de-arquitecturas-para-flutter/ 2/7
24/4/2020 Tipos de Arquitecturas para Flutter en Curso Avanzado de Flutter

);
}

En esta arquitectura cuando un Widget cambia de estado se reconstruye el árbol completo

(Toda la pantalla). En realidad esto no es tan conveniente pues lo que quisiéramos que
sucediera idealmente es reconstruir solo el widget que está cambiando y no los otros.

Esta arquitectura es buena pues cumple con el Principio de Single Responsability pues separa
la lógica del negocio de la UI, pero en general el mantenimiento de este se vuelve complejo por
la grande dependencia entre Widgets, debes controlar muchos casos para lograr el efecto que
quires dar a tu aplicación.

Escribe aquí tu pregunta +2 

Boris Köhli-Richter Estudiante · hace 14 días

no existe en utter algo parecido a REDUX (o Vuex)? ya me acostumbre tanto al estado centralizado y las
mutaciones que seria muy practico utilizarlo en Flutter.

 1 

Giovanni Civico Reyes · hace 8 días

Saludos. Esta semana he estado haciendo pruebas con esta librería (https://pub.dev/packages/ utter_redux) y tiene sus
ventajas.

1
   Arquitectura BLoC en Flutter

Mi C d II E di
https://platzi.com/clases/1603-flutter-avanzado/20219-tipos-de-arquitecturas-para-flutter/ 3/7