Swift From Scratch Delegación y Propiedades

En la lección anterior, creó un proyecto Swift simple en Xcode, una aplicación de tareas básica. En esta entrega de Swift From Scratch, agregaremos la capacidad de crear elementos de tareas pendientes. A lo largo del camino, aprenderá sobre acciones, delegación y propiedades..

Prerrequisitos

Si desea seguirme conmigo, asegúrese de tener Xcode 8.3.2 o superior instalado en su máquina. Puedes descargar Xcode 8.3.2 desde la App Store de Apple.

1. Agregando Artículos

Al final de esta lección, el usuario podrá agregar nuevos elementos de tareas tocando un botón en la barra de navegación, presentando una vista con un campo de texto y un botón. Comencemos por crear el controlador de vista que manejará la adición de nuevos elementos de tareas, el AddItemViewController clase.

Paso 1: Crear AddItemViewController

Escoger Nuevo> Archivo ...  de Xcode's Expediente menú y seleccione la Clase de Cocoa Touch plantilla de la lista de iOS> Fuente plantillas.

Nombra la clase AddItemViewController y asegúrese de que hereda de UIViewController. Vuelva a comprobar que Idioma se establece en Rápido y eso También crea un archivo XIB está sin marcar.

Dígale a Xcode dónde le gustaría guardar el archivo para el AddItemViewController clase y haga clic Crear.

Paso 2: Añadir Outlets y Acciones

Antes de crear la interfaz de usuario del AddItemViewController clase, necesitamos crear una salida para el campo de texto y dos acciones, una para un botón de cancelación en la barra de navegación y otra para el botón de crear debajo del campo de texto.

Agregar una salida ya debería ser familiar. Crear una salida en el AddItemViewController clase y nombre campo de texto Como se muestra abajo.

clase AddItemViewController: UIViewController @IBOutlet var textField: UITextField! anular func viewDidLoad () super.viewDidLoad () override func didReceiveMemoryWarning () super.didReceiveMemoryWarning ()

Crear una acción es muy similar a crear un método de instancia. De hecho, la @IBAction el atributo no es más que una sugerencia para Interface Builder. Prefijando un método con el @IBAction Atributo, nos aseguramos de que Interface Builder esté al tanto del método, que nos permite conectarlo en el guión gráfico. Dejaremos vacíos los cuerpos de ambas acciones por ahora..

clase AddItemViewController: UIViewController @IBOutlet var textField: UITextField! override func viewDidLoad () super.viewDidLoad () override func didReceiveMemoryWarning () super.didReceiveMemoryWarning () @IBAction func cancel (_ sender: Any)  @IBAction func create (_ sender: Any) 

Paso 3: crear la interfaz de usuario

Abierto Main.storyboard en el Navegador de proyectos y arrastre un Controlador de vista desde el Biblioteca de objetos a la derecha. Con el controlador de vista seleccionado, abra el Inspector de identidad a la derecha y puesta Clase personalizada> ClaseAddItemViewController.

Para agregar una barra de navegación a la vista de agregar elemento, seleccione la Agregar controlador de vista de artículo y elige Insertar en> Controlador de navegación desde el Editor menú. Esto hará que el Agregar controlador de vista de artículo El controlador de vista raíz de un controlador de navegación.

El siguiente paso es agregar un elemento de botón de barra a la barra de navegación del Controlador de vista-no la Agregar controlador de vista de artículo-y establecer su IdentificadorAñadir en el Inspector de atributos.

Cuando el usuario toca el Añadir botón, el Agregar controlador de vista de artículo Debería presentarse de manera modal. Para lograr esto, presione el Controlar tecla y arrastre desde el Añadir botón para el Controlador de navegación, seleccionando Presente Modalmente Del menú que aparece. Esto creará un segmento de la Agregar controlador de vista de artículo a lo nuevo Controlador de navegación.

Arrastre un campo de texto y un botón de la Biblioteca de objetos y agregarlos a la Agregar controlador de vista de artículo escena. Selecciona el Agregar controlador de vista de artículo y conectar el campo de texto salida con el campo de texto y la crear(_:) Acción con el botón. los crear(_:) acción debe ser activada cuando el Retocar el interior evento se dispara. Cambia el título del botón a Crear y agregue las restricciones de diseño necesarias al campo de texto y al botón.

Para finalizar la interfaz de usuario, agregue un elemento de botón de barra en la parte superior izquierda de la barra de navegación de Agregar controlador de vista de artículo y establecer su IdentificadorCancelar. Con el Agregar controlador de vista de artículo seleccionado, abre el Inspector de conexiones y conectar el cancelar(_:) acción al Cancelar botón.

Construye y ejecuta la aplicación presionando Comando-R Para verificar que todo está enganchado correctamente..

2. Implementando un protocolo de delegado

Cuando el usuario toca el Crear para agregar un elemento a hacer, el controlador de vista de elemento agregado debe notificar al controlador de vista. La delegación es una solución perfecta para este escenario. El proceso es bastante simple..

Creamos un protocolo delegado el ViewController clase se ajusta a Cuando el AddItemViewController instancia se crea, cuando el usuario toca el Añadir botón-el ViewController objeto se establece como el delegado de la AddItemViewController instancia, permitiendo a este último notificar a la ViewController instancia cuando se crea un nuevo elemento de tarea pendiente. Vamos a desglosarlo para entender mejor este proceso..

Paso 1: Declara la AddItemViewControllerDelegate Protocolo

Abierto AddItemViewController.swift y declarar el AddItemViewControllerDelegate Protocolo debajo de la declaración de importación en la parte superior. La declaración de protocolo es similar a una declaración de clase. los protocolo La palabra clave va seguida del nombre del protocolo.

importar el protocolo UIKit AddItemViewControllerDelegate func controller (_ controller: AddItemViewController, didAddItem: String)

El concepto es muy similar a los protocolos en Objective-C. El nombre del protocolo es AddItemViewControllerDelegate y define un método, controlador (_: didAddItem :).

Paso 2: Declara la delegar Propiedad

El objeto que necesita implementar el protocolo de delegado es el delegado de AddItemViewController. Primero debemos crear una propiedad para el delegado como se muestra en el fragmento a continuación..

clase AddItemViewController: UIViewController @IBOutlet var textField: UITextField! var delegate: AddItemViewControllerDelegate?…

los delegar la propiedad es de tipo AddItemViewControllerDelegate?, un tipo opcional, ya que no podemos estar seguros de que el delegar la propiedad no es nulo. Tenga en cuenta que el nombre del protocolo no se incluye entre paréntesis angulares como en Objective-C.

Paso 3: Implementar acciones

El método del delegado., controlador (_: didAddItem :), será invocado en el crear(_:) acción como se muestra a continuación. Para mantener el ejemplo simple, no hacemos ninguna validación en la entrada del usuario.

Utilizamos el encadenamiento opcional para invocar el método delegado en el objeto delegado, lo que significa que el método delegado solo se invoca si delegar Se establece la propiedad. El valor del campo de texto se almacena temporalmente en una constante, ít.

@IBAction func create (_ sender: Any) if let item = textField.text delegate? .Controller (self, didAddItem: item)

La implementación de la cancelar(_:) la acción es fácil Todo lo que hacemos es despedir al AddItemViewController ejemplo.

@IBAction func cancel (_ remitente: Cualquiera) descartar (animado: verdadero)

Paso 4: Establecer el delegado

Sin embargo, falta una pieza del rompecabezas. los delegar propiedad de la AddItemViewController La instancia no se está estableciendo en este momento. Podemos resolver esto implementando el preparar (para: remitente :) método en el ViewController clase. Primero, sin embargo, tenemos que revisar el guión gráfico..

Abierto Main.storyboard y seleccione el segue que conecta el Añadir botón con el Controlador de navegación. Abre el Inspector de atributos y establecer el segue Identificador aAddItemViewController.

A continuación, implementa el preparar (para: remitente :) método en el ViewController clase como se muestra a continuación. Nota la anular palabra clave prefijando el método. Esto debería ser familiar por ahora.

override func prepare (para segue: UIStoryboardSegue, sender: Any?) si segue.identifier == "AddItemViewController" let navigationController = segue.destination as? UINavigationController deja que addItemViewController = navigationController? .TopViewController as? AddItemViewController si deja viewController = addItemViewController viewController.delegate = self

Comenzamos por verificar el identificador del segmento, asegurándonos de que nos estamos preparando para el segmento correcto. Luego le pedimos al Segue su controlador de vista de destino. Usted puede esperar que este sea el AddItemViewController ejemplo, pero recuerde que hicimos del controlador de vista el controlador de vista raíz de un controlador de navegación. Esto significa que debemos solicitar al controlador de navegación, el controlador de vista de destino de segue, para su controlador de vista superior.

los addItemViewController constante es de tipo AddItemViewController? por el uso de la como? palabra clave. En otras palabras, utilizando como? bajamos el valor de la topViewController propiedad a un tipo opcional.

En el Si declaración, desenvolvemos el opcional y configuramos el delegar propiedad a ViewController ejemplo.

Estoy seguro de que has notado el uso de varios opcionales en la implementación del preparar (para: remitente :) método. Al interactuar con las API de Objective-C, siempre es mejor jugar de forma segura. Al enviar mensajes a nulo está perfectamente bien en Objective-C, no está en Swift. Debido a esta diferencia clave, siempre debe tener cuidado al interactuar con las API de Objective-C en Swift. El ejemplo anterior ilustra esto bien.

Paso 5: Implementar el AddItemViewControllerDelegate Protocolo

Implementando el AddItemViewControllerDelegate protocolo es similar a la implementación de la UITableViewDataSource protocolo. Comenzamos por conformar el ViewController clase al protocolo como se muestra abajo.

clase ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate, AddItemViewControllerDelegate …

A continuación, implementamos los métodos del AddItemViewControllerDelegate protocolo, que se reduce a la aplicación de la controlador (_: didAddItem :) método. Añadimos el nuevo elemento a la vista del controlador. artículos propiedad, vuelva a cargar la vista de tabla y descarte el controlador de vista de elemento agregado.

// MARCAR: Agregar ver de elemento Controlador Delegar Métodos func controller (_ controlador: AddItemViewController, didAddItem: String) // Actualizar la fuente de datos items.append (didAddItem) // Volver a cargar la tabla tableView.reloadData () // Descartar Agregar vista del elemento Controlador de despedida (animado: verdadero)

Paso 6: construir y ejecutar

Cree y ejecute la aplicación para probar si puede agregar nuevos elementos a la lista de tareas pendientes. Actualmente no validamos la entrada del usuario. Como ejercicio, muestre una vista de alerta al usuario si toca el Crear botón y el campo de texto está vacío. Agregar una tarea pendiente en blanco no es muy útil. Derecha?

Conclusión

En esta lección, aprendió cómo declarar e implementar un protocolo personalizado. También aprendió cómo crear acciones y conectarlas en Interface Builder. En la siguiente lección, vamos a completar nuestra aplicación de tareas agregando la capacidad de eliminar elementos de tareas pendientes, y también mejoraremos la experiencia del usuario de la aplicación..

Mientras tanto, echa un vistazo a algunos de nuestros otros cursos y tutoriales sobre el desarrollo de Swift en iOS.!