Implementación de Funcionalidad de Edición en Aplicación de Tareas

Clase 14 de 28Curso de Patrones MVVM en iOS

Resumen

La evolución de nuestras aplicaciones implica ir dotándolas de nuevas funcionalidades para mejorar la experiencia del usuario. En este caso, nos enfocaremos en la funcionalidad de editar los elementos de nuestras listas de tareas.

¿Por qué es importante ajustar la hora de creación?

Al revisar nuestras listas de tareas, puede que hayas notado que todas tienen la misma hora de creación. Esto se debe a que inicialmente se estaba usando un valor por defecto para la hora. Para corregirlo, se debe modificar el archivo todo_item_view usando la propiedad todo.date, garantizando así que cada tarea muestre su fecha de creación correcta.

// Código de ejemplo para ajustar la fecha
var body: some View {
    // Otros elementos del listado
    Text("\(todo.date, formatter: itemFormatter)")
}

¿Cómo se puede activar el modo de edición?

Para permitir la edición, necesitamos manipular una variable que controla la visualización de una pantalla de creación. En todo_preview_view, debemos asegurarnos de que al presionar el botón de "Editar", la variable showItToDoCreationSheet sea verdadera. Esto abrirá un overlay de edición.

// Cambio de estado al hacer clic en el botón "Editar"
Button("Editar") {
    self.showItToDoCreationSheet = true
}

¿Cómo reutilizar la vista de creación para la edición?

La reutilización es clave en el desarrollo eficiente de software. Para editar tareas, reutilizaremos la vista que ya usamos para agregar nuevas tareas. Esta vista necesita recibir parámetros adecuados, controlando si debe mostrar contenido para añadir o editar.

// Uso de la vista de adición para edición
ToDoSheet(isShowing: $showItToDoCreationSheet) {
    ToDoAddView(todo: self.selectedTodo)
}

¿Cuál es el papel del ciclo de vida de la vista en la edición?

La función onAppear es crucial para manejar el estado de nuestras vistas. Al cargar una vista, podemos decidir si mostrar los datos existentes o dejar los campos vacíos si se está creando una nueva tarea. Esto se logra comprobando si el objeto todo tiene algún valor.

// Ejecución al inicializar la vista
.onAppear {
    if let todo = todo {
        title = todo.title ?? ""
        note = todo.note ?? ""
        date = todo.date ?? Date()
    }
}

¿Cómo se implementa la funcionalidad para actualizar una tarea?

El modelo de vista (viewModel) juega un papel esencial en el manejo de datos. Se debe crear una función updateToDo que permita la actualización de una tarea específica. Esta función verificará si la tarea existe, y de ser así, actualiza sus propiedades.

// Función para actualizar una tarea
func updateToDo(todo: ToDo, newTitle: String, note: String, date: Date) {
    if let index = todos.firstIndex(where: { $0.id == todo.id }) {
        todos[index].title = newTitle
        todos[index].note = note
        todos[index].date = date
    }
    saveData()
}

¿Cómo se conecta la lógica de actualización con la interfaz de usuario?

Al realizar una edición desde la interfaz, actualizamos el viewModel con los nuevos datos introducidos por el usuario. Es esencial asegurarnos de que al presionar el botón de "Guardar", se invoque la función correcta para persistir estos cambios.

// Botón para guardar cambios
Button("Guardar") {
    viewModel.updateToDo(
        todo: todo,
        newTitle: title,
        note: note,
        date: date
    )
}

¿Cómo garantizar una experiencia de usuario fluida al editar tareas?

  • Validaciones y retroalimentación: Asegura que el usuario tenga retroalimentación visual al editar tareas, como cambios inmediatos en la interfaz.
  • Pruebas en simuladores: Realiza pruebas en diferentes simuladores para verificar que la edición se ejecuta sin contratiempos.
  • Mantenimiento del código: Revisa regularmente el código para optimizar y evitar errores futuros.

Mientras continúas explorando el desarrollo de aplicaciones, recuerda que la clave está en la reutilización inteligente del código y en el foco en mejorar la experiencia del usuario. Cada mejora es un paso hacia una aplicación más robusta y eficiente. ¡Sigue aprendiendo y experimentando!