Saltar al contenido

Lección 2 de 16 · Lectura y práctica

InheritedWidget y ChangeNotifier

Lección práctica para aplicar InheritedWidget y ChangeNotifier dentro de Desarrollo de Apps Móviles con Flutter - Nivel Intermedio, con criterios de decisión, ejemplo guiado, ejercicio y checklist de salida.

Del concepto a la práctica

Taller de esta lección

InheritedWidget resuelve la distribución de una dependencia mediante el árbol; ChangeNotifier resuelve la comunicación de cambios mediante notificaciones. No cumplen exactamente la misma función: el primero expone contexto, mientras el segundo mantiene una fuente mutable que los consumidores pueden observar.

Ejemplo resuelto

Un modelo de selección puede notificar solo cuando cambia realmente:

dart
import 'package:flutter/foundation.dart';

class FilterModel extends ChangeNotifier {
  String value = 'todas';
  void select(String next) {
    if (next != value) {
      value = next;
      notifyListeners();
    }
  }
}

La decisión evita reconstrucciones para una selección repetida.

Un InheritedWidget que contiene una instancia mutable no escucha automáticamente sus notificaciones. Para esa combinación, InheritedNotifier permite conectar el Listenable con los descendientes dependientes; otra opción es el proveedor específico de ChangeNotifier. Si escribes un InheritedWidget de datos inmutables, define updateShouldNotify comparando el valor que cambió. En la prueba del modelo, registra un listener con addListener y cuenta sus llamadas, sin depender de cuántas veces reconstruya Flutter la pantalla.

Pruébalo

  1. Crea el modelo con todas.

  2. Selecciona pendientes y registra una notificación.

  3. Selecciona pendientes otra vez.

  4. Selecciona completadas y compara.

Error frecuente: usar un modelo global para datos de una sola pantalla. Corrígelo limitando su alcance al subárbol que realmente comparte el filtro.

Comprueba tu resultado

Añade un contador de notificaciones en una clase de prueba. Con la secuencia pendientes, pendientes, completadas, el resultado debe ser exactamente 2 notificaciones y el valor final completadas.

Diagrama de decisión con ramas Sí y No y un bucle que procesa cada elemento de una lista.
CursaloMapa de práctica
Cómo avanza un programa

Una condición decide qué camino ejecuta el programa. Un bucle repite una operación mientras queden elementos, y termina cuando la lista se agota. Separar ambas ideas ayuda a seguir el flujo y comprobar casos límite.

Ver la infografía en tamaño completo ↗
Fuentes para profundizar

Sigue con Desarrollo de Apps Móviles con Flutter - Nivel Intermedio

Esta lección forma parte de un curso de Cursalo. Revisa su programa y elige entre la compra individual o el acceso a toda la escuela.

Si ya tenías acceso a este curso, entra con tu cuenta: tus derechos y tu progreso se conservan. No necesitas comprarlo de nuevo.

01 / ELEGIR UNA RUTA

El próximo paso

Aprende IA mientras construyes algo que sí necesitas.

Empieza por el curso inicial o explora el catálogo para encontrar una práctica alineada con tu trabajo.