Refactorizar un formulario en SwiftUI con un view model te permite separar la lógica de negocios de la vista y mantener un código limpio y mantenible. Aquí aprenderás a crear tu primer view model usando ObservableObject y @Published, conectándolo con tu vista mediante @StateObject, ideal si ya construiste formularios básicos en SwiftUI y quieres dar el siguiente paso hacia una arquitectura escalable.
Por qué separar la lógica del formulario en un view model
Cuando dejas todos los estados y funciones dentro de la vista, el archivo crece y se vuelve difícil de leer. Mover esa lógica a un view model te da claridad y reutilización.
En el ejemplo de la clase, partimos de un formulario que crea notas (NCreateNoteView) y lo reorganizamos en una carpeta dedicada. Dentro de Views creamos la carpeta NCreateNote y movemos ahí la vista existente, junto con un nuevo archivo Swift llamado NCreateNoteViewModel [00:35].
¿Qué es un view model en SwiftUI? Es una clase que centraliza el estado y la lógica de negocios de una vista. Se comunica con la interfaz mediante propiedades observables, dejando a la vista solo la responsabilidad de mostrar datos.
Cómo se usa ObservableObject y Published en una clase
La clase NCreateViewModel se declara con el protocolo ObservableObject. Este tipo le indica a la vista que observe toda la clase, no solo una variable suelta [01:05].
Dentro del view model ya no usas @State ni variables privadas. En su lugar:
- Marcas cada propiedad observable con
@Published.
- Eliminas el modificador
private para que los valores sean accesibles desde la vista.
- Mueves los cuatro estados originales (
title, text, size, isFavorite) y los conviertes en propiedades publicadas.
El resultado es una clase que expone su estado de forma reactiva: cualquier cambio en una propiedad @Published notifica a la vista para que se actualice.
Cómo encapsular la creación de la nota en una función
La lógica de construir el modelo NCard también vive en el view model. Justo debajo de las propiedades, agregas una función createNote() que retorna un NCard con los valores actuales del view model [02:00].
Así, la vista no sabe cómo se ensambla la nota. Solo pide el resultado.
Cómo conectar la vista con el view model usando StateObject
En la vista eliminas los @State antiguos y declaras una sola propiedad:
swift
@StateObject var viewModel = NCreateViewModel()
Al borrar los estados originales, Xcode muestra errores en cada referencia. La solución es reemplazar los nombres directos por la propiedad del view model: title pasa a viewModel.title, text a viewModel.text, size a viewModel.size y isFavorite a viewModel.isFavorite [02:35].
En el onTap del botón de guardar tampoco construyes la nota inline. Llamas a la función:
swift
let card = viewModel.createNote()
¿Cuándo uso StateObject en lugar de State? Usa @StateObject cuando observas un objeto completo como un view model. Usa @State para tipos simples como Int, Bool o String que pertenecen solo a la vista.
La razón es directa: @State está pensado para valores primitivos locales, mientras que @StateObject mantiene viva una instancia de clase observable durante el ciclo de vida de la vista [03:30].
Cómo agregar la propiedad isFavorite al modelo NCard
Aprovechando la refactorización, completas la funcionalidad de favoritos. En el archivo del modelo NCard, justo debajo de type, agregas:
swift
var isFavorite: Bool = false
Usas var y no let porque en el futuro querrás cambiar el valor de favorito sin recrear la nota [04:10]. El valor por defecto en false evita romper instancias existentes.
Después, en la función createNote() del view model, pasas isFavorite: viewModel.isFavorite al inicializar el NCard. La vista ya tiene el toggle conectado a viewModel.isFavorite, así que el flujo queda completo.
Cómo verificar el comportamiento en el preview
Al probar en el preview, creas una nota con título, texto, tamaño pequeño y marcas el toggle de favorito. Al pulsar guardar, la consola imprime el NCard con isFavorite: true [05:00].
Esa salida confirma tres cosas:
- El view model recibe correctamente las entradas del usuario.
- La función
createNote() construye la nota con todos los valores actuales.
- La vista quedó desacoplada de la lógica de creación.
Qué ganas al estructurar tu formulario con un view model
La vista pasa de tener cuatro estados sueltos y la construcción del modelo en línea a una sola propiedad @StateObject. Todo el resto vive en una clase observable, lista para escalar.
Este patrón es la base de MVVM en SwiftUI y te prepara para manejar datos más complejos: persistencia, llamadas a red o validaciones. Cuéntame en los comentarios cómo organizas tus view models y qué propiedades sueles marcar con @Published.
