Construye tu primera aplicación de iOS en Swift: fundamentos del desarrollo de iOS

1. Descripción del curso: Hola, Mi nombre es Jeff, y bienvenido al Curso de Fundamentos del IOS donde vamos a construir nuestra primera aplicación que se ve así. En este curso se asume que tienes experiencia básica en programación y estás deseando aprender más sobre el desarrollo de aplicaciones IOS. Este curso está integrado por 20 tutoriales en video para cada video, cubre un tema específico del IOS y luego aplica ese tema hacia la construcción de nuestra aplicación. Cada video de los Siri's se construye sobre los videos que vinieron antes de él para que puedas codificar junto a tu propio proyecto para cada paso del camino para tener éxito en este curso, asegúrate de entender el tema cubierto en cada video, y lo sería beneficioso codificar a lo largo de cada video de la serie. El proyecto final de este curso utiliza muchas de las habilidades que aprendimos y las aplica hacia una nueva app con un conjunto diferente de requisitos. Gracias por inscribirse en este curso, y espero verlos en el primer video tutorial 2. Cómo configurar: Lo primero que tenemos que hacer es configurar el código X. X Code es el principal entorno de desarrollo integrado de Apple, y es lo que vamos a estar usando para todo este tutorial. Entonces si estás en una computadora Mac, si vas a la tienda APP y buscas código X, debería ser lo primero que surja. Por lo que queremos hacer es descargar el código X, y una vez que se descargue Ex Card, adelante y ábrela y creará nuestro primer proyecto. La mayoría de la tarjeta Ex se abre y se configura. Ve al Create a new project y te saludarán con un menú que se ve así. Asegúrate de que estás en la sección IOS y vamos a seleccionar una aplicación de vista única. Te darás cuenta aquí que hay algunos otros tipos de plantillas, como una página basada en una base de pestañas arriba y algunos otros. Pero nuestras intenciones y propósitos queremos usar una aplicación de vista única, así que adelante y golpea a continuación, y necesitamos seguir adelante y darle el nombre a este proyecto así que solo llamaremos a este Proyecto uno y tendrás que seleccionar una organización y para un equipo Voy a poner mi equipo es ninguno porque no estoy usando ningún perfil de desarrollador asociado a esto ahora mismo para el nombre de la organización en la organización. Identifique dónde puede llegar con un nuevo nombre de organización que considere apropiado en un identificador. También puedes inventar tu propio identificador para eso también. Para el lenguaje que vamos a estar usando Swift y para las pruebas unitarias aquí, voy a desmarcar esta casilla. No vamos a estar haciendo ninguna prueba en este interrogatorio de ALS Siri así que una vez que todo eso armó, sigamos adelante y peguemos a continuación y coloquemos el proyecto en cualquier lugar que lo queramos. Y una vez que lo hayamos hecho, podemos seguir adelante y empezar a echar un vistazo a lo que tenemos dentro de esta estructura de proyecto. Entonces echemos un vistazo rápido a cómo se estructura el proyecto. Si vamos aquí arriba a la izquierda. Este icono azul es lo que se conoce como nuestro archivo Project, y contiene prácticamente todos los archivos de código fuente, los archivos de interfaz de usuario. Sabe dónde vive cada archivo de nuestro proyecto y tiene una referencia al mismo Cuando seleccionamos nuestro archivo de proyecto, vemos que aquí tenemos una sección llamada objetivos. Los objetivos son básicamente la app. El app que estamos construyendo es una app llamada Project One y un paquete de APP contiene todo el recurso es y el código compilado que construye nuestra app en toda la lógica dentro de ella . Por lo que cuando seleccionas el objetivo o básicamente seleccionas tu aplicación, puedes ver que tienes estas pestañas que aparecen, como capacidades generales, configuraciones construidas y fases de compilación. Aquí hay un montón de diferentes pedacitos de información que podríamos necesitar cambiar con el tiempo. Pero bajo general es donde encontrarás cosas como el nombre para mostrar de la aplicación, el paquete identifica dónde está la versión el equipo que estás usando para tu equipo desarrollador, así como muchas otras configuraciones como la implementación, el objetivo, los dispositivos y así sucesivamente y así sucesivamente. Entonces muchas veces tenemos que tener una comprensión de las cosas que podemos cambiar aquí si tenemos que modificar la configuración del proyecto para nuestra aplicación. Por lo que volviendo a la izquierda, tenemos nuestros rápidos archivos. Estos son los archivos de código fuente que iban a estar escribiendo la mayor parte de nuestra lógica en la aplicación . A continuación, tenemos lo que se conoce como archivo storyboard, y esta es la representación visual de nuestra aplicación. A medida que empezamos a crear diferentes pantallas en la APP, podemos agregar diferentes elementos tú a este story board para construir un diseño visual de dónde va a quedar APP y cómo va a fluir. Además, tenemos lo que se conoce como carpeta Activos. Aquí es donde pondremos cosas como un icono de aplicación son iconos para diferentes recursos está en nuestro laboratorio y diferentes pantallas y vistas, tal vez una imagen de perfil. Pondremos esos aquí así como otros activos paso en el catálogo de activos. Queremos asegurarnos de que nuestro proyecto compila y construye y se ejecuta en nuestro simulador con éxito, por lo que realmente ejecutar la aplicación. Si subimos aquí, vemos que tenemos este botón de reproducción que nos da diferentes opciones. Si hacemos click en él, tenemos la opción de correr para probar a perfil en aplicación analizador. Por lo que antes de ejecutarlo, queremos asegurarnos de que seleccionamos el objetivo de la aplicación, que es el Proyecto uno para nuestro ejemplo como el proyecto seleccionado aquí. El objetivo seleccionado. Ahora, una vez que tengas eso, debes tener una opción de simuladores para seleccionar. Voy a elegir un simulador de iPhone SC solo para ejecutar esto para asegurarme de que funcione. Si no tienes ningún simulador apareciendo por el motivo que sea, si hay un problema de instalación, tienes la opción. Aquí es que descargas simuladores, y si haces clic en eso, te llevará a la lista de tiempos de ejecución simulados que puedes descargar. Y una vez que eso se complete, tendrás una lista de simuladores que aparecen en este hombre. Se baja. Entonces una vez que hayas seleccionado tu simulador, sigue adelante y pulsa el botón de reproducción y eso va a compilar el proyecto, construir nuestro paquete de aplicaciones e instalarlo en el simulador, y hasta ahora parece que todo va bien. Se puede ver eso, dice lanzando Proyecto uno, y sólo le daremos a este minuto el minuto del simulador para arrancar y verificar que todo se vea bien. Mi simulador está listo y funcionando, y veo un fondo blanco, lo cual es una buena señal, y si volvemos a nuestro tablero principal de cuentos y lo seleccionamos para que aparezca aquí y volvamos y echemos un vistazo a nuestro simulador. Lo que estamos viendo en nuestro simulador ahora mismo es la representación visual de este controlador de vista desde el storyboard, se puede ver que no hay elementos de interfaz tú en este controlador de vista, como un campo de texto o cualquier tipo de botones, y es un fondo blanco. Y como este es el controlador de vista inicial, eso es lo que se está presentando aquí mismo en el simulador. Entonces ahora echemos un vistazo más profundo a los controladores de vista y entenderemos un poco más sobre cómo son el pan y la mantequilla de una aplicación IOS. 3. Todo sobre controladores de ver con ver: ahora adelante, selecciona al controlador de vista dentro del tablero principal de cuentos y baja hasta la esquina inferior izquierda aquí. Y asegúrese de expandir esta opción de menú delineado documento. Y cuando lo hagas, tendrás aquí tu jerarquía de controlador de vista, y podrás ver eso con su controlador de vista. Contiene una vista, y un controlador de vista es el pan y la mantequilla los bloques de construcción de una aplicación IOS. Se puede pensar en un controlador de vista como una pantalla en una aplicación que podría contener cualquier número de elementos como campos de texto y otras vistas y vistas de tabla. Entonces y así sucesivamente cuando queríamos pantallas adicionales en nuestra aplicación. En su mayor parte, vamos a crear alguna forma de controlador de vista, y vamos a navegar de controlador de vista a controlador de vista, pasando datos de uno a otro para navegar por nuestra aplicación a través de lo que se conoce como Segways. Y esencialmente, el controlador de vista puede simplemente es que es un controlador que controla vistas, y ese es su trabajo en propósito primario. Entonces si queremos agregar elementos a un controlador de vista, lo que podemos hacerlo desde una perspectiva de sello de storyboard es, si bajamos aquí a la biblioteca de objetos y empezamos a mirar a través de la selección seleccionada de opciones aquí, podemos arrastrar elementos a la vista. Entonces digamos, por ejemplo, quería agregar un campo de texto que comience para Campo de texto y obtengo una opción aquí. Y Aiken, arrástralo sobre el controlador de vista. Y si vuelves atrás y miras la jerarquía aquí, puedes ver que esta vista contiene una sub vista para un subcomponente. Y ese es el campo de texto. Y en general, así es como vamos a diseñar más para ustedes elementos en este curso. Es genial para principiantes. Es visualmente fácil de ver, y representa el flujo de nuestra aplicación, y podemos avanzar con bastante rapidez haciendo este enfoque. Entonces ahora que tenemos un entendimiento básico, tenemos que los controladores trabajen dentro de un archivo storyboard, necesitamos entender cómo se relacionan de nuevo con los archivos de código fuente. Entonces si vas por aquí y vas al icono del editor asistente y haces clic en él, se va a abrir el panel lateral y podemos tener nuestro controlador de vista dot swift archivo lado a lado con nuestro controlador de vista desde el storyboard. Y como miramos aquí, si seleccionamos nuestro controlador de vista y volvemos aquí al lado derecho y vamos a la clase, Inspector, Inspector, puede ver que hay una clase llamada controlador de vista. Por lo que de forma predeterminada, el controlador de vista que se crea en el proyecto se asigna automáticamente a este archivo de código fuente justo aquí. Y a medida que creamos controladores de vista adicionales, tenemos que asignar el archivo de código fuente para mapear al controlador de vista correspondiente en el archivo storyboard. Entonces hagámoslo por ejemplo. Sólo para que no tengas comprensión de cómo realmente lograr eso. Entonces vuelve aquí abajo a la biblioteca de objetos. Lo que queremos hacer es buscar un controlador de vista y podemos arrastrar ese elemento a nuestro guión gráfico aquí. Y así ahora tenemos un segundo tú controlador. No tiene una subclase ni ningún tipo de asociación con archivo de código fuente. Vamos a crear eso ahora mismo. Así que selecciona un nuevo controlador de vista que acabas de crear y pasa a tu código fuente. Y debajo de su carpeta, haga clic derecho y vaya a un nuevo archivo y vamos a usar un nuevo archivo swift aquí, y vamos a llamar a este controlador de vista de detalle, y vamos a seguir adelante y crear ese archivo. Ahora, asegúrate de tener tu vista detallada. Aquí se seleccionan el control, y en realidad voy a sacarlo en mi lado derecho. Si hago clic en este menú y voy a archivos recientes, puedo buscar controlador de vista detallada. Si ves interfaz, no hagas clic en esa. Asegúrate de dejar el que no diga interfaz. Por lo que eso traerá el archivo de código aquí del lado izquierdo. Mantengamos abierto nuestro guión gráfico y sigamos adelante y hagamos la asociación entre este archivo de código y este tú elemento aquí. Por lo que necesitamos realmente crear nuestra clase. Y lo hacemos importando en el marco necesario que contiene controladores de vista. Y lo que vamos a hacer es importante. Ustedes niños, les explicaré en un minuto por qué necesitamos hacer esto. Por lo que necesitamos crear nuestro controlador de vista de detalle de clase, que deriva de usted. Veo controlador y vamos a seguir adelante y a estructurar eso. Y agreguemos un método aquí llamado View, sí cargó y solo haremos un súper trabajo. Tú sí cargaste y vamos a descomponer exactamente lo que está pasando por lo que acabamos de hacer. Entonces el controlador U I view es de las manzanas. Tú kit marco. Contiene el nivel base que controlas que Apple proporciona para que utilicemos en nuestro desarrollo de aplicaciones para Iowa. Y básicamente estamos diciendo que hay controlador de vista detallada es es subclase ing o no subclase ing pero llega de ti. Yo veo controlador. Por lo que contiene todas las propiedades y elementos ahí que viene de ti. Yo kit. Ahora bien, ¿cómo hacemos esta asociación de aquí a aquí? Bueno, eso es bastante fácil. Si seleccionas el controlador de vista en el guión gráfico y volvemos al inspector de clases aquí ahora tenemos la oportunidad de crear nuestra sub clasificación. Y así si ves aquí mismo está buscando cualquier tipo de tienes tu controlador y simplemente pasamos a hacer uno llamado controlador de vista detallada para que podamos crear la asociación aquí escribiendo en detalle, view controller y podrías ver ejecuta automáticamente poblando eso para nosotros. Y otra cosa que queremos hacer aquí es armar un storyboard. Yo d. Y en general lo que todo utiliza el nombre de la clase como el nombre del guión gráfico I d. Y eso básicamente significa que cuando estamos buscando cargar el controlador de vista programáticamente tal vez siempre podamos buscarlo por su nombre, que es vista detallada del dedo del controlador, cárguelo en el código. Entonces una vez que tienes esa configurada, ahora has creado el enlace entre el archivo de código fuente en la U. S. En el elemento U aquí. Entonces echemos un vistazo a la carga vista. Si comandamos click sobre ti, tienes controlador e ir a saltar la definición. Aquí es donde podemos ver todos los diferentes métodos disponibles que Apple nos proporciona que podemos usar el de ustedes. Tienes tu controlador. Se puede ver aquí mismo. De ahí viene la vista did load. Y dice aquí mismo en los comentarios llamados después de que la vista se haya cargado para la vista, se crea el control y el código. Esto es después de muchos de ustedes. Y generalmente aquí es donde hacemos la mayoría de no todo nuestro código de configuración para la mayoría de las circunstancias es cuando se llama a este método. Por lo que es muy importante que anulemos esto en nuestra subclase para ver controlador, y definitivamente estaremos entrando en más de estos métodos del ciclo de vida a medida que avanzamos. 4. Seguir y controladores de navegación: Ahora hablemos de Segways, Segways o cómo pasamos de un controlador de vista a otro controlador de vista. Y lo podemos hacer a través de algunas maneras diferentes. Y con lo que vamos a empezar es lo que se llama Segway móvil. Y para hacerlo, queremos hacer un par de cosas. Por lo que lo primero que queremos hacer en nuestro detalle de tu controlador es cambiar el color de la vista para que podamos distinguir visualmente en qué controlador de vista estaba encendido. Entonces si tienes tu nuevo controlador detallado seleccionado aquí, si vas por encima y encuentras la vista aquí y te selectivo y luego vas por aquí, queremos seleccionar la pestaña para los atributos. Inspector, bajamos a las vistas, color de fondo, e iba a cambiar de opinión a un color diferente aquí, podamos ver visualmente que esta es la pantalla de detalles. Ahora, fin de activar el Segway, necesitamos algún tipo de click de botón donde elemento con el que interactuaría un usuario para llegar de uno a otro. Y podemos bajar a la biblioteca de objetos aquí y buscar un botón y podemos arrastrar ese botón hacia nuestro primer controlador de vista, y voy a dejar el campo de texto que tenía ahí desde antes. Y todo lo que hacemos es poner el botón tipo de en el centro. Voy a arrastrarlo hacia adelante, y estoy acercando un poco en el lienzo aquí y sólo una especie de aumentar el dentro de la altura del botón y centrarlo. Y si vas por aquí con tu botón seleccionado, hemos usado en lugar del botón de texto predeterminado. Bueno, sólo dio decir dónde y lo que tenemos que hacer a continuación es realmente crear la conexión para hacer el Segway. Ahora la forma más fácil de hacerlo es un constructor de interfaces, y al hacerlo, podemos sostener nuestro botón selector. Podemos mantener presionada la tecla de control en la limpieza en el teclado, hacer clic y luego arrastrar hacia arriba a la vista detallada, controlador y liberación, y verás que tenemos una acción Segway que aparece. Tenemos un show, un show detail, presente modo temprano, y luego tenemos estos no adaptativos deprecate ID Segways. Entonces lo que vamos a hacer es un espectáculo y verás enseguida que eso crea la conexión de aquí a aquí. Entonces ejecutemos esto en el simulador y veamos exactamente cómo se verá esto. Mis simuladores arriba y funcionando aquí. Y no te preocupes si tus botones un poco fuera de centro mientras aún lo puedas ver, eso está bien. Hablaremos de cómo posicionarse, bloquear las cosas con diseño automático más adelante en la serie. Si ahora mismo, sigue adelante y pulsa el botón Segway y puedes ver que fuimos a nuestro controlador de vista detallada , tenemos una pantalla real aquí, pero desafortunadamente no tenemos manera de volver a nuestra vista inicial controlador. Estamos atrapados aquí porque no tenemos forma de descartar el flujo. Ya ves, no tenemos ningún botón Atrás ni forma de bajar. Y este tipo de Segway es conocido como Segway móvil. Se utiliza para presentar información que ocuparía la pantalla completa, y presumiblemente se utilizaría para capturar algún tipo de entrada del usuario como, digamos, digamos entrada un formulario de registro, un registro informar sobre que aún tenía a alguien para despedir el flujo. Ahora, obviamente, no hemos agregado un botón aquí, así que estamos atascados por el momento. Ahora podemos rectificar esto fácilmente con lo que se llama controlador de navegación. Ahora lo que harás a continuación es volver a tu story board y seleccionar el Segway real y eliminarlo. Y lo que haremos en su lugar es que vamos a introducir esta idea de un controlador de navegación. Y la forma más fácil de configurar este controlador de vista con un controlador de navegación es seleccionar tu nuevo controlador, ir al menú del editor aquí, ir a incrustar y luego seleccionar controlador de navegación. Y enseguida. Lo que vas a ver es que tenemos este controlador de navegación que está apuntando a nuestro controlador de vista en la parte superior. Aquí tenemos una barra de navegación, y esto va a ser importante en un momento. Entonces repitamos los mismos pasos. Vamos a conectar nuestro botón aquí al controlador de vista detallada aquí. Entonces si mantenemos pulsada la tecla de control, haga clic y arrastre sobre el. Tenemos nuestra acción. Segway sube y vamos a hacer show y ya verás ahora que tenemos un botón Atrás en nuestro controlador de vista detallada que no teníamos antes. Entonces sigamos adelante y ejecutemos esto en el simulador, y luego pasaremos por una discusión sobre los controladores de navegación y ¿qué es exactamente lo que está pasando aquí? Entonces ahora si hago clic en mi botón Segway aquí, verás que entramos en el controlador de vista de detalle. Pero tenemos una manera de volver. Tenemos un botón Atrás, presionamos botón Atrás, regresamos. Si volvimos a tener Segway, vamos hacia adelante, y también se puede ver que la animación es diferente. Es casi como si se desliza, y otra cosa que puedes hacer aquí es que si un poco arrastras en los bordes, tienes la capacidad de arrastrar a través para volver también. Y eso es solo una característica de los controladores de navegación que soportaban de forma predeterminada, a menos que lo apague. Y si recuerdas, el Segway móvil o el primer segmento que hicimos salió de abajo y nuestro controlador de navegación, Segway se desliza hacia un lado. Ahora vamos a cavar un poco en los controladores de navegación. El controlador de navegación es un tipo de ustedes yo veo controlador. De hecho, el controlador de navegación deriva de usted, tiene usted controlador, por lo que hereda todas las propiedades que tiene usted controlador, pero agrega en una barra de navegación y una matriz de ustedes controladores que el pila de navegación gestiona. Se puede pensar en Seguin entre controladores de vista como empujando y haciendo estallar controladores de vista dentro y fuera de la pila. El stack interno de ustedes controladores que contiene el controlador de navegación. Entonces por defecto, cuando añades un controlador de vista a través del guión gráfico y te conectaste a través de un Segway. Cualquiera que sea este controlador de vista de detalle, o cualquier otro controlador de vista que se derive de este controlador de navegación todos heredaremos la barra de navegación, que proporciona un botón Atrás o una forma de retroceder a menos que lo apaguemos para cambiarlo para hacer otra cosa. Bueno, entonces podrías preguntarte, qué tipo de sake espera, ¿ qué tipo de sake espera,utilizo hacer es un modelo o uso un controlador de navegación? Y eso realmente depende del flujo de ustedes controladores en su proyecto y de lo que están tratando de hacer. Entonces si tienes el controlador de vista independiente que puedes presentar desde cualquier lugar, y tal vez se vaya a recopilar al usuario información en un formulario o en un tutorial o un logotipo de splash o algo que pudiera presentarse, entonces despedido. Un modelo Segway tendría más sentido ahora en una serie de pantallas como esta donde tienes , ah tipo de relación padre hijo o una relación de vista detallada maestra que tener una especialmente si necesitaban Barra de navegación. El controlador de navegación tiene perfecto sentido porque puedes comenzar con una vista y perforar hacia abajo en una serie de vistas que están todas interrelacionadas, y luego puedes navegar fácilmente por tu camino de respaldo de la pila al controlador de vista principal. 5. Comprender los controladores de vista de la mesa: hasta ahora te hemos tocado, tienes controladores y controladores de navegación, y tenemos un poco de comprensión de cómo moverte en una aplicación. Pero para poder construir una aplicación de lista de cosas que hacer, necesitamos básicamente una lista. Entonces lo que realmente necesitamos en cuanto a una lista para Iowa es una vista de tabla, y específicamente vamos a utilizar una forma especializada conocida como la tabla de ti controlador . Ahora, una mesa de tu controlador no es más que una especializada. Tienes tu controlador que contiene una vista de tabla en implementos, algunos de los métodos y funcionalidad que se necesita para que una tabla tuya muestre sus datos y personalice las celdas o las filas de los datos. Entonces si bajamos a nuestra biblioteca de objetos aquí, cuando buscamos controlador de vista de tabla, verás que tenemos uno que aparece en la lista. Y si seguimos adelante y arrastramos que posee ese lienzo, podemos ver de inmediato que tenemos una vista de tabla, una celda o una tabla que vendes, y eso se nos da por defecto, solo de usar una tabla de ti controlador. Y si seleccionamos aquí nuestro controlador de vista de tabla y entramos en la jerarquía de documentos, si miramos aquí y vemos que tenemos una tabla de ustedes, la celda real y luego la vista de contenido de esa celda y para eso vamos a empezar nuestra lista de hacer es que vamos a empezar a estructurar y configurar nuestro controlador de vista de tabla para que pueda cargar nuestro para hacer elementos de lista y permitirnos agregar nuevos elementos para hacer lista y hacer selecciones para perforar en la vista de detalles para los ítems que seleccionamos de la lista, igual que hicimos con nuestro controlador de vista de detalle. Queremos enganchar un archivo de código fuente rápido a nuestro controlador de vista de tabla correspondiente aquí mismo. Entonces sigamos adelante y hagamos eso. Ahora ve al archivo del proyecto aquí y dentro de la carpeta del código fuente y haz clic derecho en la carpeta y haz un nuevo archivo y selecciona un archivo rápido. Y voy a llamar al mío para hacer list table view controller, y voy a crear eso y de inmediato tenemos que seguir adelante y hacer nuestra habitual importante de ti te gusta, que contiene la clase y todos los métodos y funcionalidades para controladores de vista de tabla así como usted tiene usted controladores a y vamos a hacer clase a hacer lista tabla vista controlador. Y se va a derivar de ti yo controlador de vista de tabla. Y vamos a anular el método view did look, que será nuestro punto de entrada una vez que este controlador de vista se cargue por primera vez. Y una vez que tengamos eso configurado aquí, asegúrate de estar en el editor asistente. Si tu asistente de editor está cerrado, puedes abrirlo con solo hacer clic en el botón de aquí para abrirlo. Y sigamos adelante y abramos nuestro guión gráfico por un lado y voy a poner el mío por el lado derecho aquí y vamos a mirar, vamos a asegurarnos de que tenemos nuestros controladores de vista de mesa seleccionados e iremos al inspector de clases aquí y donde dice que quieres Controlador de vista de tabla. Vamos a cambiar eso por el controlador de vista de tabla para hacer lista. También vamos a copiar ese nombre. Úsalo para el guión gráfico i d. En la restauración I d. para que así podamos encontrarlo con el mismo nombre. Y ahora en realidad echemos un vistazo a lo que tiene el controlador de vista de tabla para que puedas empezar sólo esos comandos haciendo clic en ti. Tomo el controlador de vista, que nos llevará a la documentación para esta clase. Por lo que mirando su controlador de vista de tabla, podemos ver un par de cosas. Si miramos la jerarquía de herencia y los protocolos a los que se ajusta, deriva de ti, ¿ tienes controlador? Por lo que de inmediato, U. S. A. Con el controlador contiene toda la funcionalidad o hereda la funcionalidad que expone el controlador de vista. Pero además de eso, tiene su propia vista de tabla, que es lo que lo convierte en el controlador de vista de tabla así como implementar el delegado de vista de tabla en partículas de origen de datos. Y vamos a llegar a profundidad técnica en eso por ahora mismo. Pero lo que es importante saber es que esto es sólo otro especializado. Tienes tu controlador que contiene una vista de tabla y nos permite hacer diversas operaciones sobre elementos de esa lista en esa tabla de ti. Entonces ahora volvamos en realidad y empecemos a barajar algunas cosas en nuestro guión gráfico. Lo que queremos Dio es reemplazar nuestro controlador de vista uno por el botón Segway y retirarlo por completo. Nuestro controlador de vista de tabla para hacer lista va a tomar su lugar en su lugar. Entonces lo que podemos Dio es seleccionar nuestros Segways desde el controlador de vista hasta el detalle y vamos a seguir adelante y presionar la tecla delete para eliminar eso al mismo tiempo, vamos a eliminar por completo este controlador de vista y su controlador de navegación por lo que puede tipo de seleccionar ambos de esos y eliminados de aquí. A veces es más fácil si seleccionaste de la, uh, jerarquía que se ve por aquí. Y yo voy a hacer lo mismo por el controlador de navegación. Ahora, por aquí en el código fuente del proyecto. También te voy a quitar Controlador tan rápido. Ya no vamos a usar eso. Y vamos a reemplazar eso por nuestro controlador de vista de tabla para hacer lista Así que nos desharemos de eso por ahora. Y vamos a traer nuestro controlador de vista de tabla para hacer de nuevo, y lo vamos a poner dentro de un controlador de navegación de la misma manera que lo hemos hecho con nuestro controlador de vista tan seleccionado iremos al editor y luego haremos incrustado un controlador de navegación. Y así en este momento, nuestro controlador de vista de tabla acaba de heredar una barra de navegación y tiene una tabla tuya. Por lo que tiene muchas de las cosas que necesitamos para construir una lista de cosas que hacer. Y otra cosa que debemos recordar hacer es si íbamos a ejecutar esto ahora mismo, tenemos que asegurarnos de que tenemos que encontrar estos controlador de vista inicial. Entonces en este caso, ya que el controlador de navegación es el primer elemento que se va a cargar, asegúrese de que es el controlador de vista de inicio. Y podemos hacerlo seleccionándolo, pasando aquí al inspector de atributos. Y es una casita de verificación es controlador de vista inicial. Asegúrate de tener eso comprobado y lo sabrás porque tienes esta pequeña flecha gris aquí indicando que este es el controlador de vista inicial en este archivo de guión gráfico. Y así vamos a seguir adelante y correr eso ahora mismo, y no vamos a ver nada, pero vamos a asegurarnos de que todo funcione en nuestro simulador. Entonces miro lo que parece ser una lista vacía. está ejecutando mi controlador de vista de tabla. Es el controlador de vista inicial, pero no hay nada en él. Puedo arrastrar un poco por ahí, y si puedes ver que mi vista de tabla rebota mientras me muevo, Um, Um, pero aparte de eso no es más que una lista vacía con la barra de navegación en la parte superior hasta que empecemos realmente implementando el código para enganchar nuestra fuente de datos y mostrar elementos en la lista, y eso es lo que vamos a empezar a hacer ahora mismo. 6. Implementar la lista de TODO: ahora, con el fin de crear cualquier lista, necesitamos elementos que hacer para las tareas. Entonces vamos a crear un modelo de datos que represente una tarea. Y si pasamos a nuestra jerarquía de archivos de proyecto por aquí y vamos a crear un nuevo archivo swift para representar esta tarea, así que haga clic derecho y haga nuevo archivo final bastante rápido. Y solo llamemos a este tipo de tarea y vamos a crear otro archivo. Así que vuelve a la carpeta, derecha Haz clic en Nuevo archivo, y en realidad vamos a crear una tarea, así que solo llamaremos a esta tarea una. Ahora, el tipo de tarea va a definir la categoría en la que caerá nuestra tarea. Y esto será cualquier newme del tipo de tarea, y crearemos diferentes categorías. Representa esto. Entonces tal vez tengamos un caso para estudiar un caso para el trabajo en casa, un caso para el recubrimiento, y puede ser un caso para la planificación de vacaciones, y creo que eso es bueno para ahora mismo. Entonces tenemos algunos tipos diferentes de tareas que definimos para lo que nos interesa encontrarlo y ahora vamos a volver a la tarea que rápida y crear una nueva clase para representar esta tarea tan clase, y esta clase va a contienen algunas propiedades. Entonces vamos a tener un título de tarea let. Simplemente lo llamaremos titulado de Type String. Dejar que la fecha de vencimiento, la fecha de tipo y dejar que el tipo de tarea tome. Y una cosa que vamos a hacer aquí es hacerlos privados para que su único contenido en esta clase. Y entonces necesitamos un Isar inicial para inyectar valores para cada una de estas propiedades privadas . Entonces tienes un Isar inicial y ese izer inicial va a contener una fuerza tipo título , una fecha tipo fecha de vencimiento en un tipo, la cinta de tareas y lo que haremos dentro del cuerpo de este izer inicial es un signo cada uno de estos valores inyectados a nuestras propiedades privadas en la clase, por lo que auto titulado equivale a título auto fecha de vencimiento igual a Fecha de vencimiento y auto. Ese tipo es igual a tipo y asegúrese de no tener ningún problema de compilación. Adelante y hacer comando ser o puedes subir aquí al producto y construir, y ves comando para ser es la clave de acceso rápido para representar eso. Solo asegurémonos de que nuestro código se compila con éxito. Parece que sí. Por lo que ahora, con nuestro modelo de datos configurado, necesitamos seguir adelante y crear instancias de tareas y agregarlas a la lista aquí para que podamos verlas visualmente representadas como Rose en nuestra vista de tabla. Por lo que ahora necesitamos realmente volver a nuestra tabla de lista para hacer de ti controlador. Y cuando lo hacemos, necesitamos realmente empezar a escribir un poco de código aquí. Por lo que de inmediato tenemos nuestra mesa en controlador. Eso sub clases que yo tabla vista controlador deriva de ella. Y lo primero que tenemos que hacer es crear una fuente de datos, y la fuente de datos va a contener toda la rosa para una vista de tabla y definirá eso como esta Privada, Nuestra fuente de datos de tipo Una colección de tareas equivale a una lista vacía a empezar. Y lo que vamos a hacer aquí es crear una función privada, construir fuente de datos, y vamos a llamar a eso justo después de que nuestras cargas de vista. Por lo que solo llamaremos a construir fuente de datos aquí. Ahora, lo que este método va a hacer es crear un par de tareas en anexarlas a nuestra matriz de fuentes de datos . Entonces lo que haremos aquí es fuente de datos que depende. Y vamos justo dentro de eso, Una nueva tarea. Por lo que haremos tarea y haremos título para el 1er 1 estará estudiando programación una fecha de vencimiento. Y solo usaremos la fecha de hoy por ahora mismo. Eso lo limpiaremos más adelante. Y para el tipo de tarea para este solo será la codificación de puntos porque ese es el tipo que corresponde con esta tarea. Y voy a copiar esto y pegar esto Ah, cada dos veces más y vamos a cambiar la tarea ahí dentro. Por lo que para el siguiente solo se hará haciendo lavandería y vamos a cambiar el tipo dos puntos de trabajo de casa . Y para la final, Uh, bueno, dio planeando viaje a donde queremos ir. Um, España? Qué tal giro jugando viaje a España y para el tipo oído hará planeación vacacional. Así que hemos ido adelante y construido nuestra fuente de datos y ahora lo siguiente que tenemos que hacer es implementar dos de los métodos aquí que nos permiten agregar la fuente de datos a la vista de tabla y luego por cada fila enlazar nuestros elementos de fuente de datos a cada celda de vista de tabla. Entonces si bajamos aquí al fondo de nuestra clase, vamos a empezar a pegar número de filas en sección y ya ves que eso va a terminar auto para nosotros. Y echemos un vistazo a lo que está pasando en esta función ah La firma se les proporcionó una vista de tabla y se les proporcionó una sección. Y lo que necesitamos para regresar es cuántas rosas pertenecen a esta sección de la vista de tabla y lo que simplemente vamos a proporcionar es devolver el recuento de existencias de fuentes de datos, lo que significa odio. En nuestra lista hay tres artículos. Nuestra vista de tabla va a contener tres filas. Eso es exactamente lo que este método aquí, dice. Y esto es algo que la tabla de ustedes tiene que tener para saber cuántos datos contiene . Entonces eso es fácil. Simplemente podemos devolver el conteo, y eso es todo lo que necesitamos hacer para una mesa muy sencilla de ustedes. El siguiente método que necesitamos implementar es vender para fila en ruta de índice, y lo que hace este método es que devuelve una tabla de usted vende por cada fila de datos que está contenida en nuestra matriz de fuentes de datos. Entonces el método real aquí, medida que empiezo a escribir, es auto para la ruta de índice de fila y retornos. Tú yo mesa de ti vendo. Entonces si pudieras entrar, ellos se meten sobre la función para nosotros y entonces podemos empezar a trabajar en eso. Entonces, mirando la firma del método, tenemos una tabla de ustedes. Tenemos una ruta de índice y tenemos que devolver una celda de vista de tabla. Y así lo que terminará haciendo aquí es hacer Vamos a ver tabla una celda igual a la vista de tabla pasada a nosotros dot de que celda reutilizable con identificador. Y voy a explicar lo que esto significa en el segundo así para ruta de índice y usaré el parámetro de ruta de índice aquí que se pasó. Y verás aquí que cuando miramos la vista de tabla así que es un tipo, y ese tipo eres tú. I table view cell, que es la clase base para una tabla que vendes. Y entonces lo que vamos a hacer aquí es que vamos a devolver la mesa que vendes, pero necesitamos entender en qué se encuentra exactamente una celda de vista de tabla U I. La forma más fácil siempre es empezar por entrar en la documentación de la manzana. Entonces si te seleccionamos tabla vista celda y comandamos click. Había saltado a la definición. Ahora estamos dentro de la documentación de U I Kit para la clase que quieres mesa que vendes, y si miramos aquí, podemos ver que deriva de ti, veo de lo que realmente no hemos hablado demasiado todavía, pero es la base vista de nivel para la mayoría cada tipo de ustedes que controlo. Y mientras miramos aquí abajo, podemos ver un par de propiedades de interés. Ahí hay una imagen. Tú ahí hay una etiqueta de texto. Hay una etiqueta de texto detallada, y hay vista de contenido, vista de fondo y algunas otras cosas aquí. Por lo que los bits importantes, para nuestros propósitos y propósitos serán la etiqueta de texto, potencialmente el detalle, etiqueta de texto y potencialmente la vista de imagen. Por lo que de inmediato vamos a utilizar la propiedad de etiqueta de texto para vincularla realmente el título de nuestra tarea a. Entonces volvamos atrás y empecemos a implementar eso ahora mismo y así que tenemos que hacer aquí es como acabamos de ver una tabla de ustedes venden o yo tabla vista Cell contiene una etiqueta de título o una etiqueta de texto . Y si queremos firmar el texto, tenemos que hacerlo en una tarea particular. Entonces, ¿qué sabemos? ¿ Ahora mismo? Tenemos una ruta de índice, y por suerte, una ruta de índice contiene una fila, y cada fila corresponde a ah sección en nuestra matriz. Entonces la forma más sencilla de hacer esto sería decir, fuente de datos en la ruta de índice No fila y lo que necesitamos enlazar. Bueno, si miramos aquí, necesitamos atar nuestro título. El problema es que definimos nuestro título como privado por lo que no podemos acceder a él fuera de esta clase. Y entonces lo que podemos hacer es simplemente quitar privado para título, que lo hace de tipo, interno y fértil significa que la propiedad puede ser utilizada por todo el módulo, Uh, o básicamente el todo fuera, um, y medios privados Sólo puede ser utilizado por los contenidos dentro de la clase. Siempre queremos por defecto a lo privado porque es buena práctica toe Onley exponer propiedades a otras clases que necesitan ser expuestas. No queremos exponer todo porque siempre abre oportunidades para que otros programadores cometan errores. Cuando comiencen a usar nuestro código si les damos acceso a cada propiedad o método de nuestra clase al que podrían no necesitar acceso. Entonces por eso mordimos en privado hasta que necesitábamos hacer algo un poco menos restaurado, menos restrictivo. Entonces ahora que se trata de un tipo de acceso interno, si volvemos aquí, entonces podemos hacer fuente de datos en ruta de índice punto ro título de punto. Antes de correr todo, vamos ah, un vistazo a la celda aquí que significa nuestro identificador. Si volvemos al story board, vamos a traer eso aquí y vamos a hacer el editor asistente y mantener nuestra lista de cosas que hacer de ustedes controlador del lado derecho aquí. Y vamos a seguir adelante y seleccionar la lista de cosas que hacer para su controlador de vista de tabla y buscar la celda de vista de tabla. Asegúrate de tenerlo seleccionado y ve al inspector de direcciones aquí y verás que aquí hay esta sección para volver a usarla. Identifica el aire aquí. Voy a usar el mismo nombre que usé en el código, que solo será vender nombre muy genérico y echemos un vistazo rápido a ese método aquí . Y como tenemos el comando opciones, haga clic en esta deaky celda reutilizable con identificador. Hagámoslo y leamos la documentación y veamos exactamente qué está pasando aquí. Por lo que dice enseguida que cuanto más nuevo es un nuevo método ridículo que garantiza que venden, fue devuelto y recita adecuadamente. Asumiendo que el identificador está registrado ahora, también hay otro por encima de él. Ahí se convierte un opcional te tabla ver celda que es utilizada por el delegado para adquirir una celda ya asignada en lugar de asignar una nueva. Para esencialmente, tratando de reutilizar uno que está en la memoria y, si no está disponible, creando uno nuevo, um, en esa instancia. Pero estamos usando este método aquí. Razona la que no devuelve un opcional Y básicamente lo que ese dicho es que si tenemos más tipos de celdas, vamos a asociar esas con diferentes identificadores así que podría tener una celda para tal vez, um, tú saber, una celda de vista de tabla de alimentación. Podría tener uno para un comentario o, ya sabes, como un ah, una celda de vista de tabla publicitaria. Y eso podría dar a cada uno de esos diferentes identificadores y no puedo darles todos mismo identificado porque necesitan algo que diga de manera única Esta es un tipo particular de célula versus la otra para que pueda de que la correcta. Entonces por eso queremos establecer ese identificador aquí y también en el guión gráfico para el tipo de celda para el identificador aquí y asegurarnos de que coincidan. Ahora, sigamos adelante y ejecutemos nuestro proyecto en ver cómo se ve todo hasta este punto y parece que todo está funcionando. Puedo tener tres. Tengo tres elementos en mi vista de tabla mis, uh, tres tareas que definí aquí en la fuente de datos, y bastante seguro, que todos aparecen simplemente bien en nuestra vista de tabla. 7. Conexión del regulador de vista de detalles: por lo que nuestra tabla de lista para hacer está funcionando bien. Pero queremos poder pasar esos datos a nuestra vista detallada aquí. Y tal vez queremos mostrar más información o tener un diseño diferente para cada tarea de nuestra lista. Entonces en este momento no tenemos forma de llegar de nuestra lista a nuestra vista detallada justo ahora mismo. Entonces lo que haremos es seguir adelante y conectar la lógica para moverte a la pantalla de detalles cuando seleccionemos una fila en particular en nuestra lista de cosas que hacer. Y la forma más fácil de hacer esto es volver al concepto de Segways. Ah, están creando una transición Segway tras la selección de nuestra vista de lista a la vista detallada, es bastante sencillo. Lo que podemos hacer es si volvemos a un selecto nuestro para hacer listar controlador vista tabla, volvemos al esquema del documento aquí, queremos conseguir una bodega de la celda. Entonces con tener el auto seleccionado, podríamos hacer algo similar. Donde mantenemos presionada la tecla de control, hacemos clic y arrastramos hacia el controlador de vista de detalle y para el tipo de Segway vamos a usar un show. Y aquí verás de inmediato que heredamos la barra de navegación del controlador de navegación que encapsulan SAR para hacer este controlador de vista, cual tiene un botón Atrás para volver y esa conexión se ha establecido. Pero todavía hay una cosa que necesitamos dar. Tenemos que poder enviar los datos o básicamente nuestra tarea, la prueba seleccionada de aquí a aquí. Y ahora mismo, incluso con el Segway dicho, no tenemos forma de hacer eso. Y eso es algo que vamos a tener para implementar esto en código. Entonces vamos a necesitar hacer esto en dos lugares. Empecemos primero con el controlador de vista de detalle. Entonces vamos a entrar en el detalle de tu archivo Controller Swift, y vamos a dio es crear una propiedad. Simplemente llamaremos a esta tarea Laura Task Type, y va a ser opcional. Y lo que haremos es carga imputada, que se llamará derecha Cuando entremos a este do controlador, solo imprimiremos imprimiendo tasker. Lo desenvolveremos solo para estar seguros. Si dejar tarea igual tarea imprimir tarea DOT Título y lo haremos a continuación es volver a nuestro controlador de vista de tabla para hacer lista y, uh , bueno, seguir adelante e implementar un nuevo método que aún no hemos visto, que es llamado Prepararse para Segway. Y este es un método que vamos a anular. Si seleccionas el método aquí, déjame ver si puedo jalarlo de la documentación. Uh, puede que no diga nada de inmediato, pero déjame ver si podemos saltar a la definición aquí. Parece que no puedo verlo, pero esto se llama justo cuando el Segway está a punto de ocurrir. Y entonces este es el punto en el tiempo donde si queremos pasar datos al próximo controlador al que vamos, tenemos la oportunidad de hacerlo aquí. Si miras los parámetros de este método, tienes el Segway real, que es un guión gráfico Segway de Estados Unidos. Y entonces tienes al remitente, o básicamente ¿qué mandó la llamada? ¿ Cuál fue el elemento que fue aprovechado que invocó toda esta cadena de operaciones para nosotros? Va a ser el tú una mesa para que vendas porque eso va a ser lo que el usuario ha seleccionado. Eso inició la transición para el Segway. Y es por eso que es tipo puede ser cualquiera, porque cualquier tipo posible podría ser algo que desencadenó esto. Entonces tenemos que lanzarlo, sobre todo cuando sabemos que estamos esperando que se vaya a haber seleccionado una tabla de ustedes celdas de tiro que podamos desenvolver y conseguir nosotros mismos y luego obtener la ruta de índice de nosotros mismos y ellos obtengan los datos para esa carretera en particular y luego enviar eso sobre el destino do controlador. Ahora, el Segway también tiene una propiedad Segway destino. Y se podía ver aquí que es un tipo. Tienes tu controlador. Y aquí es a donde vamos. En nuestro caso, este sería controlador de vista detallada, y así es como pasaremos los datos. Entonces lo que en última instancia hará aquí es hacer esto con ustedes cosas. Um, si dejar celda seleccionada es igual a remitente como tú tabla ver celda. Y en realidad, no, nos vamos. Cree aquí una declaración de guardias porque si no podemos conseguir esto, no nos importa hacer otra cosa. Simplemente regresarás. Entonces vamos a resguardar y vamos a dejar que sean seleccionados. Selby, el centro como un EU capaz de que vendas si no lo podemos conseguir, tenemos rescate asumiendo que sí lo conseguimos, pero podemos Entonces hacer es dejar ruta de índice seleccionada igual a vista de tabla, y estamos usando la propiedad de vista de tabla para el tabla de ti controlador ruta de índice de punto para celda. Y así lo haremos es pasar en la celda seleccionada. Y estos métodos básicamente ah, método disponible en la vista de tabla para obtener una ruta de índice. Es una especie de método de conveniencia. Hay algunos otros aquí para indexar ruta para fila en una ruta de índice de punto particular para una celda proporcionó una celda en particular y rutas de índice para Rose en un Tennessee dirigido en el aviso aquí que estos devuelven opciones. Por lo que también tenemos que comprobar para asegurarnos de que estamos volviendo sobre la ruta del índice aquí. O podríamos tener un bloqueo en tiempo de ejecución si forzamos a desenvolver algo con un no valor. Por lo que también haremos otra guardia. Deja checar aquí guardia, Deja que la ruta de índice seleccionada no regrese. Y suponiendo que todo eso funcionó, vamos a hacer una comprobación más aquí, y eso va a ser, um, um, bien, deja que el destino lo controlas un controlador de vista diesel igual segway dot destino usted controlador como el tipo de detalle, controlador de vista y en realidad voy a usar un if let aquí. Aún así, supongo que realmente no importará, pero bueno, podemos hacer cualquiera o más giro en este punto asumiendo que todo funcionó, ¿Te lo dices, Controller oscurece Tarea igual. Entonces ahora necesitamos averiguarlo, OK, tenemos la ruta de índice seleccionada y la ruta de índice seleccionada tiene una propiedad en ella llamada Roe y eso realmente nos da la fila en básicamente nuestra matriz para donde existe el ítem. Que si recuerdas aquí, eso es exactamente lo que hicimos para atar nuestro título a una celda. Hicimos exactamente lo mismo. Utilizamos la fuente de datos en el punto de ruta de índice escrito para obtener ese elemento, y lo vamos a hacer exactamente lo mismo aquí abajo y prepararnos para Segway para que podamos asignar la tarea para nuestros invitados son controlador de vista detallada basado en el índice seleccionado camino, fila para nosotros mismos y eso es todo. Entonces sigamos adelante y construyamos esto y verificamos que construimos y tiene que ser el seleccionado en su camino que una vez más y todo esté bien. Y ahora una cosa más podemos hacer aquí, pero antes de correr. Este es, uh, un principio básico de depuración es, ah, ah, concepto de usar puntos de ruptura. En ocasiones si quieres pasar por tu código para ver si las cosas están funcionando o no funcionan como se esperaba, puedes ir aquí en la barra lateral si no tienes tus números de línea visibles. Lo que puedes hacer es entrar en el código X en preferencias, y creo que está debajo de Ver aquí. ¿ Dónde está eso? Bajo fuentes y colores, edición de texto números de línea. Entonces, bajo la edición de texto números en línea, puedes hablar todo eso encendido y apagado para ver el número de línea en particular donde quieres un punto de descanso . Una vez que tus números de línea estén encendidos, puedes ir por aquí en esta columna del lado izquierdo y hacer click en un pequeño lugar de puntos de ruptura . Entonces una vez que esto se carga, podemos ver el camino de la ejecución y probar las cosas que están trabajando como esperamos que lo hagan. Entonces ahora sigamos adelante y ejecutemos esto en el simulador. Voy a seguir adelante y seleccionar el estudio de programación. Y así parece que nuestro Segway completado. Nuestro controlador de vista detallada acaba de ser invocado. Hiciste carga se llamó y ahora estamos revisando para asegurarnos de que somos capaces de pasar la tarea que desenvolvemos tuvo éxito. Y bastante seguro, programa de estudio se está imprimiendo en la consola. Por lo que hemos pasado con éxito nuestra tarea de nuestra lista de cosas por hacer a nuestro controlador de vista detallada . 8. 7. Subclases de UitableViewCell: hasta ahora está empezando a juntarse. Pero aún tenemos que hacer algunas cosas más para que se vea bonita y entender algunos elementos más comunes para el desarrollo de la interfaz de usuario en IOS. Pero para que empecemos, queremos volver al tema de la sub clasificación. Por lo que obviamente subclase Tara controlador de vista detallada aquí. Si recuerdas, al asignar su clase al controlador de vista de detalle, y podemos hacerlo con muchos, muchos, muchos elementos en Iowa especialmente las clases de tu gusto y la siguiente clase, queremos una subclase que nos permitirá hacer más. La personalización está en nuestra celda de vista de tabla real. Entonces si vamos por aquí y ampliamos nuestra tabla de lista para hacer de su controlador y celular ex electo y vamos al inspector de vidrio aquí, se puede ver que en este momento las clases sólo tú yo tabla de ustedes la vendo no han sido asignadas . No ha sido sub clasificado. No hay manera de que realmente podamos retocar o agregar. Pruebas son aciones a esta célula, y eso es realmente algo que queremos hacer en este momento. Entonces lo que haremos es volver a donde está nuestro código fuente en la carpeta del proyecto o haga clic derecho , y vamos a crear un nuevo archivo, y vamos a llamar a esto nuestro para hacer vista de tabla auto. En realidad, vamos a hacer vista de tabla de tareas así un poco más concisa, no haga clic, cree, y vamos a seguir adelante e importar y lo necesario Te gusta, que contiene la celda de vista de tabla. Y luego definiremos nuestra clase clase clase tarea tabla vista celda, que deriva de ti I tabla vista celda y seguiremos adelante y pondremos esa configuración así como por ahora mismo. Y lo que haremos aquí es volver a nuestro storyboard. Y ahora que hemos creado una celda de vista de tabla de tareas, entonces podemos subclasificarnos en el archivo de guión gráfico real. Entonces si nos hemos seleccionado y volvemos a la clase aquí, podemos hacer celda de vista de tabla de tareas y había entrado ahí para asegurarnos de que se salga. Y esa subclase acaba de definirse. Y otra cosa podemos hacer lo que estaban aquí. A medida que empezamos a sumar archivos más rápidos, queremos tratar de mantener nuestro proyecto un poco agradable y organizado. Entonces lo que voy a hacer es empezar a crear carpetas y si haces clic derecho en tu carpeta de proyectos aquí para el nombre de tu carpeta Proyectos e ir al nuevo grupo. Pero puedes hacer es empezar a crear carpetas para poner estas piezas de código fuente. Y así debilita Dio, por ejemplo, de ustedes controladores. Y podemos tomar nuestro controlador de vista detallada y por turno, tirando de la tecla de turno y Click Week y luego seleccionar tanto el detalle como la tabla de lista para hacer que el controlador. Y luego podemos arrastrarlos a esa carpeta de controladores de vista y eso los moverá justo al lugar correcto ahí. Y también lo haremos aquí es que haremos otro por un básico de mesa de ustedes mismos. Entonces la tabla pocas celdas y nos llevaremos nosotros mismos acabamos de crearla arrastrará eso a la tabla de ustedes mismos carpeta así como así, y haré una cosa por los modelos o nuestros modelos de datos. Entonces siendo dos modelos y podemos llevarla nuestra tarea y podemos poner eso ahí dentro, y luego podemos simplemente tener una carpeta general para utilidades o simplemente, uh, tipo de lugares donde realmente no tenemos nada bien definido, pero se utiliza en otros lugares como la altura de nuestras tareas. Por lo que iba a crear una carpeta llamada Utilidad. Ya sabes, solo pon ahí el tipo de tarea. Y así parece que tenemos todo organizado aquí en su mayor parte, con nuestro código fuente. También puedes hacer clic derecho en la carpeta y dio ordenar por nombre si lo prefieres alfabético, y te daré a todo un buen alfabético ordenando tu estructura de proyecto. A continuación, queremos enfocarnos en el estilo, son Task Cell. Y si vuelves a la lista de entrevistas, controlador de vista de tabla y recuerdas eso aquí mismo cuando en realidad estábamos Deke Ewing la celda al devolverla. Estamos asignando esta propiedad de etiqueta de texto aquí mismo, que está vinculando el texto. Pero si vuelves atrás y miras el story board, no está realmente claro que algo esté pasando. Tienes que inferir que eso está pasando en el código y ser un poco agradable si pudiéramos representar visualmente todo desde nuestro storyboard aquí para que no tengamos que cavar a través del código para ver qué está pasando, y puedo Sólo mirar esto hasta eso. De acuerdo, aquí hay una etiqueta. Va a haber texto encuadernado en esta celda. Puedo moverlo, posicionarlo, cambiar la fuente, el color, todo así sucesivamente y así sucesivamente. Y entonces ese es el siguiente paso que queremos dar. Y así hacerlo va a requerir un par de pasos. Um, si notamos aquí en nuestra jerarquía de bajo vista de tabla en nosotros mismos que tenemos esta vista de contenido. Entonces digamos, por ejemplo, yo quería hacer algo como simplemente cambiar el color de fondo, que de blanco a otra cosa, y voy a seguir adelante y cambiarlo a eso amarillo ahora mismo puedes ver que ese se muestra visualmente en la vista de contenido de la celda. Entonces si nosotros si ejecutamos esto en nuestro simulador, vamos a seguir adelante y ver qué parece una célula amarilla. Y bastante seguro, cambiamos el color. Bueno, ¿y si queremos cambiar la altura de la celda? ¿ Y si queremos que la celda sea un poco más alta? Entonces a primera vista, pensamos que podemos simplemente arrastrar esto hacia abajo y, ya sabes, hacer más alto. Parece que funciona bien. Seguiremos adelante y correremos en el simulador y Ah, y veremos qué pasa en un momento aquí y miraremos eso. No hizo un cambio. Entonces, ¿qué está pasando aquí? Tenemos que diagnosticar eso. Ah, parece que hay algún otro ajuste que está anulando la altura de nuestra celda, y eso es algo que necesitamos cambiar. Para soportar la altura deseada desde el constructor de interfaz, vuelva al controlador de vista de tabla de lista para hacer. Y aquí hay otro método que vamos a necesitar usar otro método que necesitaremos anular. Entonces si recuerdas, número de filas y sección fue lo que nos devuelve la cantidad de datos en la tabla y la ruta de índice de carretera auto nos devuelve una vista de tabla real. Vender Bueno, resulta que hay otro método. Altura para fila en ruta de índice que devuelve flotante SCG, y lo que queremos hacer es averiguar de dónde viene esto y tipo de entender qué está pasando con él. Entonces si realmente comandamos click en el controlador de vista de tabla U I, podemos ver que hay estos dos protocolos Tú I tabla vista delegado Y tú yo tabla vista fuente de datos. Ahora bien, no se pueden obtener fuentes de datos de donde proviene el número de filas en sección y ruta de índice de carretera auto . No obstante, tienes un delegado de vista de tabla contiene otras cosas relacionadas con la personalización de nuestra celda y altura. Furrow es una de las cosas. Entonces si empezamos a escribir altura para fila en ruta de índice, puedes ver eso aquí mismo. Uh, ese es uno de los métodos que podemos anular. Y hay una descripción muy larga recibida, comparada muestran que aquí sale. A veces lo hace, a veces no lo hace. Pero aquí podemos ver que aquí es de donde realmente viene ese método. Y parece que me llevó a la versión objetiva c de esto de esto, uh, uh, ap I fuera de este marco, lo cual está bien. Pero si te desplazas por aquí, hay muchos otros métodos que podemos anular además de solo esto. Y así quiero decir, hay mucha personalización debilitar dio en una mesa de ustedes, pero volvamos atrás y solo para aclarar una vez más, porque nuestro controlador de vista de tabla se ajusta a estos dos protocolos. Nos permite anular ciertos métodos para hacer personalización en nuestros propios controladores de vista, que es exactamente lo que estamos haciendo en el controlador de vista de tabla para hacer. Entonces si necesitamos devolver una altura para una venta, bueno, entonces probablemente necesitemos saber cuál debería ser esa altura, Cuál debería ser el valor numérico que regresamos. Entonces de una manera, podemos hacer eso y coincidir con nuestra expectativa visual es si volvemos en el guión gráfico aquí y seleccionamos esa celda y vamos aquí a este ícono que se parece a una regla el inspector de tamaño, um, tiene aquí unos atributos de altura de fila que podemos establecer y arrastrar arriba, arriba y abajo así. Entonces digamos que sólo quiero que este camino sea e no sé, 145 y altura. Entonces con ese número, con ese número establecido aquí, ese es el número que vamos a necesitar para volver en altura para la ruta de índice de carretera. Entonces aquí sólo vamos a volver 1 45 Ahora, vamos a seguir adelante y correr esto y ver cómo se ve con esa altura y porque necesito necesito realmente poner aquí la palabra clave de anulación porque estamos anulando este método en nuestro aplicación. Entonces, vamos a ejecutarlo. Y así tenemos nuestra estatura ahora, pero vas a estar como, Vale , bueno, ¿por qué está pasando cosas blancas? ¿ De qué se trata todo eso? Y 11 otro truco de depuración visual que podemos usar es que hay un icono aquí mismo si ves dónde está mi cursor del ratón en el código X. Y si hacemos clic que nos lleva a la jerarquía de vista de nuestra app viva. Y si empezamos a dar clic por aquí, podemos ver diversos elementos de nuestra estructura. Si nos expandimos por aquí a la izquierda, se puede ver que haters, nuestro controlador de vista. Y si bajamos, hay una vista de tabla y aquí hay una celda, y luego así sucesivamente y así sucesivamente. Y si en realidad hacemos click, podemos ver que Oh, eso es un tú yo tabla de ti etiqueta justo aquí. Entonces parece que las etiquetas se estiran y eso parece un poco extraño, ¿ verdad? Entonces volvemos en nuestro código, averiguamos, OK, bueno, bueno, donde tenemos firmando esa etiqueta. ¿ Y por qué se estira tan alto? Y vemos aquí mismo que aquí es donde realmente estamos asignando nuestro texto a la etiqueta. Así que vamos a la derecha comentándolo y ejecutar el AP una vez más. Entonces esto lo construirá fresco y verá qué cambia eso. Y así ahora, pesar de que no estamos vinculando el texto, ya no ves esa etiqueta blanca. Se ha ido porque nunca se le está asignando. Vamos a terminar haciendo es usar nuestra propia etiqueta. No vamos a usar la etiqueta predeterminada real en la celda. Y en lugar de devolver solo un tú una tabla de que vendes, vamos a devolver la celda tipo tarea o la celda personalizada que creamos para que podamos hacer clientes asiáticos en ella en su lugar. 9. Introducción a la diseño automático: Entonces comencemos agregando nuestras propias etiquetas a nuestra venta bien en una etiqueta para título. Y creo que Lata etiqueta para el oleaje tipo A para empezar. Entonces lo que podemos hacer aquí es empezar a bajar a la biblioteca de objetos aquí en el lado derecho y empezar a escribir etiqueta. Y, uh, vamos a arrastrar una etiqueta sobre nuestro guión gráfico aquí, y, uh, vamos a seguir adelante y poner esa puesta y vamos dio está bien arrastrado las esquinas aquí para aumentar el dentro de la altura. ¿ Qué tipo de saca a los bordes? Esas pequeñas líneas punteadas son una especie de guías de diseño que te dicen dónde debes parar. Um, Dragon Beyonce porque eso estaría fuera de las, ya sabes, las pautas recomendadas para las pautas de estilo de interfaz de usuario que ofrece para Apple . Pero lo que podemos hacer aquí es intentar que esta trampa alguien que se vea así. Y si vas al inspector de atributos, podríamos empezar a cambiar el tamaño de fuente y el posicionamiento de color para que pueda cambiar mi posicionamiento desde izquierda Justificado Teoh en el centro. También puedo cambiar mi fuente real si así lo deseo por defecto. Es la diversión asistente. Pero si vas bajo la costumbre aquí, um, podemos empezar a escoger para hacer cosas diferentes. Creo que probaré un dedo del pie telefónico diferente. Déjame ver si hay algo aquí dentro que me gustaría usar. Eso se ve bien. Ah, dio. En realidad, creo que voy a quedármelo y venderlo ¿Puedes ya? Realmente no veo nada ahí dentro que me interese. Lo cambiaré a Ah, audaz. ¿ Qué tal eso? Um, eso está bien. Y voy a subir el tamaño sólo un poquito aquí, y creo que eso debería de ser bueno para ese. Um, y también haremos lo mismo para el tipo, y solo vamos a seguir adelante y poner ese tipo de justo debajo. Entonces arrastraremos otra etiqueta sobre. Y en realidad, en lugar de arrastrar otra etiqueta podría ser más fácil simplemente copiar la que sí tenemos. Sólo hacer comando, ves? Y si tipo de mueves tu cursor a cualquier parte de tu celda y obtienes comandos V pegar, podemos pegar el que acabamos de copiar. Y si queremos cambiar esto para que sea, como, como, una especie de sub iluminado como un subtítulo en lugar de un título, Um, simplemente podemos irnos. Y en lugar de audaz, hazlo Ah, veamos qué luz es lo que parece. Sí, supongo que podría trabajar. Um, consigues ese conjunto ahí y lo posicionas en consecuencia. Entonces una cosa de la que sólo necesitamos hablar es de lo que se conoce como auto layout. Y es básicamente un sistema de diseño basado en restricciones que nos permite crear interfaces de usuario adaptativas , interfaces que responderán a los cambios, como la orientación del dispositivo o el propio dispositivo real. Podría estar corriendo en un IPHONE, SC, un iPhone siete plus y un iPhone 10. Hay un montón de, o incluso un iPad. Hay muchos dispositivos y tamaños de pantalla diferentes que tenemos que considerar cuando diseñamos nuestros APS, y ahí es donde el diseño automático entra en juego aquí. Entonces si vamos a entender algo sobre las restricciones, necesitamos entender ¿cómo aplicamos esas restricciones desde el guión gráfico o desde el constructor de interfaces? Y así probablemente me has visto en algún momento haciendo algunas cosas aquí con tal vez horizontal y verticalmente y contenedor para centrar las cosas. Pero aquí es donde empezamos a meternos en nuestras limitaciones desde aquí. Entonces si seleccionamos, por ejemplo, nuestro título etiquetado y bajamos a este pequeño ícono aquí para agregar nuevas restricciones, también tenemos opciones aquí . Básicamente constreñido. ¿ Eres elemento o nuestra etiqueta a cierta cantidad de píxeles o puntos de distancia de la parte superior? El izquierdo, el derecho en la parte inferior, Estos aire, también conocido como el lado principal en el lado posterior, tenemos restricciones para agregar un fijo con la reedición de aspecto de altura fija. Aquí hay un montón de cosas con las que podemos retocar. Y el diseño automático puede ser frustrante a veces para los nuevos desarrolladores. Toma un poco de tiempo dominarlo y entender como agregar restricciones que no entran en conflicto con las restricciones y otros elementos. Por lo que una cosa útil que Apple agregó se acabó en este ícono aquí. Hay una forma de resolver los problemas de un diseño, y por lo general te da una forma de establecer restricciones sugeridas para que puedas tenerlo tipo de establecer automáticamente cosas para ti, Um, que tal vez no hayas podido descifrar por tu cuenta. Y cuando se hicieron selecciones de auto let. Si vas por aquí, y te metes en tu mesa. Si vendes tu vista de contenido, verás ahora que tienes una pequeña sección aquí llamada restricciones, necesito ampliar que en realidad puedas ver cada restricción individual en la colección de restricciones. Ya sabes, tienes el trailing, el top, el liderante y, uh, ya sabes que puedes Puedes inspeccionar todos los valores que aparecen en el atributo Inspector aquí ni siquiera hizo modificaciones a ellos si quieres. Pero lo que queremos hacer es mantenerlo muy básico. Entonces lo que haremos por los nuestros es que vamos a sumar los nuestros manualmente. No vamos a hacer la manera preferida de Apple. Entonces vamos a seleccionar nuestra primera etiqueta. Vamos a bajar aquí, y lo que vamos a hacer es aplicar una restricción superior, una restricción de izquierda o de izquierda, una restricción de arrastre o una restricción de derecha y una altura de 44 y agregar cuatro restricciones. Y así ahora, básicamente estaban diciendo que si nuestra célula se expande en altura, son etiquetas básicamente van a permanecer fijas y ancladas a la parte superior de esta celda, Realmente no va a ir a ninguna parte Ahora vamos a seguir adelante y aplicar lógica similar a nuestra etiqueta de subtítulo a continuación. Vamos a seleccionarlo, ya sabes, vuelta aquí abajo, y vamos a sumar nuestras restricciones. Entonces en lugar de hacer una parte superior, creo que vamos a tratar de fijar esta a la parte inferior de la celda por lo que haremos una restricción inferior de cero trailing o restricción derecha de cero en la restricción inicial o izquierda de cero en una restricción de ocultación de 44. Entonces eso va a arreglar esa altura y tipo de pasador que se venden al fondo. Y así, hasta ahora, tan bueno. Um, nosotros mismos, nos vemos bastante bien. Ahora sigamos adelante y ejecutemos esto y veamos cómo se ve visualmente en nuestra mesa de ustedes en. Una cosa que tendremos que hacer aquí es solo asegurarnos de que has comentado dónde asignas tu texto aquí. De lo contrario, esto va a anular cualquier cosa. Hicimos un constructor de interfaces, Así que sigamos adelante y ejecutemos esto en el simulador y C sin configurar el texto. Esto es lo que tipo de tenemos. Tenemos nuestra etiqueta de título aquí y somos una etiqueta de subtítulo a continuación y posiciona justo cómo las configuramos en Interface builder. Y así lo he decidido. Bueno, ya sabes, veo que tipo de poner mi etiqueta al fondo aquí, pero creo que se ve un poco mejor si la movía hacia arriba solo un poquito más. Y así podemos hacerlo con bastante facilidad. Si volvemos aquí a ese pequeño icono de regla para el inspector de tallas y hacemos clic en él, lo que podemos hacer es ajustar un poco el eje Y moviéndolo hacia abajo. En realidad trae nuestra etiqueta hacia arriba. Entonces si empezamos a dar click hacia abajo, creo que la mía estaba a los 90. Si digamos llevárselo al lago 75 mis hombres podrían verse un poco mejor. Ya verás que estoy metiendo todas estas cosas naranjas aquí. Y esto es básicamente manzana diciéndome que, Oye, ¿tienes un problema aquí? Dijiste algunas restricciones que decían que esta cosa llega a ser el eje Y de 90. Acabas de mudarte al 75. ¿ Qué está pasando? Por lo tanto, dale algunas opciones, puede actualizar las restricciones, lo que significa que sus restricciones, lugar de esperar estar en 90 será un 75 que resolverá ese tema. Puedes actualizar el marco de tu etiqueta para que coincida con las restricciones. Ahora bien, si lo hiciéramos eso son restricciones están en 90. Bueno, sólo movemos todo al 75. Si actualizamos el marco para que coincida con la restricción, en realidad se moverá. Se etiquetan de nuevo a 90 s. no queremos que donde podamos dejar que Apple vuelva a calcular las restricciones enteramente en hacerlo por nosotros. Y así realmente no queremos hacer eso porque ese tipo de derrota todo el propósito de lo que hicimos. Eso Otra opción a es que puedes hacer esos cambios aquí un oleaje así que el tiempo para volver a bajar a la botella de resultado un problema tienes también que opciones, actualizas la restricción, Constance. Eso es realmente lo que queremos. Porque si hacemos eso, básicamente le dice esa restricción a hey, esperar que esta cosa esté a 75 no a 90 y entonces verás que esa advertencia acaba desaparecer. Y ahora corremos esto y veamos cómo se ve. Y para que eso se vea un poco mejor. Um, lo suficientemente bueno para lo que queremos hacer ahora mismo. Otra cosa que podrías darte cuenta es como si aquí hubiera una línea divisoria. Ese tipo de looks hazlo ahora que hemos empezado a cambiar algo del estilo y sería agradable si pudiéramos apagar eso y resulta que podemos, realidad es una propiedad de la vista de tabla. Entonces si volvemos al guión gráfico y seleccionamos la vista de tabla por aquí y luego vamos al inspector de atributos aquí, hay una propiedad llamada separador que decía a un valor predeterminado. Eso Lo que podemos hacer es convertir eso de default a ninguno si optamos por hacerlo. Y si ejecutamos eso ahora mismo, veamos cómo se ve eso. Entonces ven ahora que ese separador se ha ido por completo, um, digamos que queremos agregar nuestro propio, um, um, separador, tal vez un poco más grueso que se ve un poco más grande. Podríamos hacer eso a y otra vez. Es otra oportunidad para practicar usando mucho diseño. Entonces en lugar de una etiqueta, lo que vamos a hacer aquí es buscarte, tenerte y es solo una vista llana como esta. Vamos a arrastrar esto a la vista de contenido de nosotros mismos y sólo vamos a tratar conseguirlo aquí. Y lo que vamos a hacer es hacer que esto sea realmente pequeño arrastrado. Creo que una altura de ah, tal vez ocho va a ser buena por ahora y de currículum en un poquito porque estoy sentado en mi trackpad. Voy a arrastrar los bordes de esta vista todo el camino hasta el borde de esta vez no a las pautas recomendadas para especie de crear nuestra propia pequeña barra divisora. Y lo que voy a hacer aquí no es una posición que derecha voy a ir a algunas restricciones a ella, para fijarlo al fondo y fijar esa altura tan de manera similar Entonces lo que le hicimos a esa etiqueta de subtítulos . Voy a hacer una restricción de cero en la restricción inferior de cero para la derecha o el trailing en una restricción de cero para la izquierda o la delantera y una altura de ocho. Se trata de hacer ese amor que arregló justo donde lo queremos. Y también voy a cambiar el color de esta vista por algo distinto al blanco. Entonces si llego al inspector absoluto aquí, creo que el negro probablemente se vería bastante bien. Aquí s para que podamos conseguir que se vea así. Entonces ahora corremos esto una vez más y veamos cómo se ve eso visualmente en nuestro simulador . Y entonces tal vez esa barra es un poco demasiado gruesa, así que está bien. Simplemente podemos ir y ajustarlo igual que hicimos al actualizar nuestras restricciones en el camino. Entonces otra vez, otra oportunidad para practicar en el layout. Podemos bajar eso apretado de tal vez siete Teoh de ocho a Tal vez antes se vería un poco mejor. Y notarás aquí que mis vistas divisorias se movieron hacia arriba ya que he disminuido la altura . Entonces vamos a querer dedo del pie si nosotros si disminuimos la altura en cuatro, no lo empujaríamos hacia abajo por cuatro en el eje Y. Por lo que puedes hacer eso desde aquí si quieres. O simplemente puedes simplemente intentar arrastrarlo hasta abajo así, Um, Um, y puedes conseguirlo justo en el borde de ahí, y todavía tendrás esa naranja porque solo acabas de hacer cambios en el marco sin actualizando las restricciones. Entonces sólo tenemos que volver atrás y hacerlo. Lo hicimos antes por resolver en temas relacionados. Y actualizaremos la restricción Constance para que coincida con el marco en el que acabamos de ajustar y veamos cómo se ve eso ahora. Y apuesto a que eso se ve un poco mejor y lo que teníamos antes y, sí, creo que eso es lo suficientemente bueno para trabajar. Podríamos ser capaces de ir un poco más delgados, pero no es el fin del mundo. 10. Pullar en la celón de la vista de Pulling de tareas de: Por lo que ahora tenemos nuestra célula diseñada, pero aún necesitamos reemplazarte por completo. I table view cell in self road index path to use nuestra tabla de tareas de ti vendes. Y así tenemos que hacer eso ahora mismo. Así que volvamos al controlador de vista de tabla Necesidad de hacer menos a punta de ti controlador. Y queremos volver por sí mismos. Ruta de índice de carretera aquí. Y así de inmediato. Um, ya sabes, si comienzas a escribir tabla de tu vendes, uh, te darás cuenta de que el tipo eres tú. Yo te meto en Eso no va a funcionar por usar una clase de aduanas up, uh, que creamos, que es la mesa de tareas que vendes. Entonces realmente no es un tema de lo que podemos hacer aquí es, ya que nuestra celda de vista de tabla de tareas es una tabla de que vendes, simplemente podemos lanzarla como una tabla de tareas. Tú vendes, y nosotros lo haremos. Aquí es ya que eso va a ser un opcional Bueno, solo haz un cheque. Entonces si deja que vista de tabla venda la gente nuestra mesa de pruebas tú mismo lo haremos algo diferente. Lo que podemos hacer aquí es encontrar un bar. Uh, celular es igual que tienes una tabla de ti mismo para que puedas empezar con una nueva instancia de una celda . Y si realmente podemos eliminar o bien declaración aquí y si obtenemos nuestra vista de tabla, vendemos aquí el tipo de celda, va a ser una mesa de tareas usted mismo. Um, entonces lo que haremos aquí es por el regreso técnicamente, vamos a devolver la celda, y entonces vamos a decir eso nosotros mismos. Los ojos son mesa, tú vendes así que lo haremos asignación ahí. Eliminaremos esto aquí y ahora. Básicamente estamos diciendo que vamos a construir una nueva celda porque no podemos regresar hasta venderla pidió a cambio un valor. Si somos capaces de pollar, eres celular como mesa de tareas de ti. Entonces, adelante y asigne que venda de vuelta aquí y devuélvala. Pero todavía hay una cosa que nos falta. Necesitamos configurar la celda para que pueda vincular el modelo de datos a la vista real poner realmente las etiquetas para el título de la tarea y la categoría de tarea. Todavía no hemos escrito ningún código para hacer eso. Eso lo que debilita dio es si vamos a nuestra mesa de tareas de ustedes venden. Um, aquí no hemos implementado nada, pero vamos a crear una nueva función. Por lo que el teléfono configure con tarea y los parámetros van en la tarea A, que es el modelo de datos. Y tenemos que seguir adelante y crear salidas de constructor de interfaces que nos permitan conectar nuestras etiquetas nuevo a la clase aquí para que podamos hacer los encuadernamientos cuando recibamos un configure con la tarea. Entonces lo haremos aquí es abrir el asistente de editor. Entonces pensé que abrir por aquí y parece que tengo eso estirado demasiado lejos de ti para ver si podía colapsar ese servidor un poco deslizante. Y voy a sacar mi storyboard sobre uno de los 10 dolores aquí. Y así si entramos en estas celdas y ampliamos la vista de contenido, podemos ver que tenemos estas dos etiquetas el título y se titula Ahora, ya que subclasificamos esta celda es celda de vista de tabla de tareas. Tenemos una conexión directa de vuelta al archivo de código fuente para que pueda crear salidas de constructor de interfaces justo de vuelta al código. Por lo que mantienen presionada la tecla de control y luego hacen clic y arrastran hacia la celda dentro de la clase. Y suelto puedo cocinar una nueva conexión aquí de tipo outlet. Y desde que seleccioné la primera etiqueta, iba a llamar a esta tarea título la etiqueta y conecté. Y también voy a hacer lo mismo por el algún título justo debajo de él Voy a ir a mantener presionada la tecla de control. Haga clic y arrastre por aquí. Se llamó Esta tarea. Entonces título así y luego sigamos adelante. Y cuando obtenemos una tarea para configurar nuestra celda de vista de tabla, simplemente puedes dio hacer título de tarea Ese texto es igual a tarea el título. Y así tenemos un problemita aquí. Si comienzas a escribir punto de tarea solo se expone el título. Y si recuerdas por qué, sólo estamos mostrando justo el título. Originalmente cuando usamos la mesa de ti mismo. Entonces no un problema que necesitamos hacer es volver aquí y exponer algo más de lo privado a lo interno para que podamos acceder a él fuera de la clase son la clase de tarea. Entonces, para hacer eso, simplemente haz esto. Simplemente podemos quitar privada del tipo y solo tener que dejar que así sea su interna, que es la cantidad de Maine interna. Es realmente esto, um interno son los actores como tipo de acceso Thea. No obstante, si no especificas nada interno es el predeterminado por lo que privado es explícito. Interno es implícito a menos que lo hagas explícito escribiendo interno. Entonces sólo algo para recordar. Entonces volvamos ahora. Combinamos nuestra tarea. Subtítulo Así que texto de subtítulo de tarea es igual a punto de tarea Y si no puedes ver el tipo, do comando ser para construir el proyecto para que el piloto pudiera recoger el cambio. Acabamos de hacer el modificador de acceso y luego deberías ver el tipo que aparece aquí en esta lista . Um, así que enseguida, vamos a tener un pequeño problema aquí. El problema es porque no podemos hacer la asignación porque el tipo de tarea no es una fuerza. Es simplemente literalmente en nombre de una tarea, escriba su propio tipo. Entonces hay un par de formas en las que podemos trabajar. Esto probablemente el más fácil, va a ser simplemente convirtiendo esto a su cadena con el indio. Entonces si entras en tu tipo de tarea, lo que podemos hacer aquí es decir que esto va a ser una cuerda y debilitarse. Podemos hacer una especie de valor ah string legible para cada uno de estos casos así podemos en lugar de estudiar todas las minúsculas, podemos decir estudiar así, podemos hacer un valor por defecto aquí para el trabajo de lo demás. No, podemos hacer recubrimiento así. Debilitar dio planeación vacacional es así. Entonces es un poco más legible por humanos cuando lo atamos a cualquier tipo de elemento tú. Entonces volviendo aquí, um, que porque es un tipo de cadena ahora que podemos hacer es combinamos al Taif y combinamos al valor crudo, que es la cadena real en sí. Podría necesitar hacer comando ser para construir un proyecto aquí eso que compila con éxito. Pero mira, una vez que empiezo a escribirlo de nuevo después de compilar, tengo un valor crudo, que es una cadena que aparece. Entonces, um, lo que probablemente podemos hacer aquí es cambiar porque no queremos indicar ese tipo solo un poco más legible para que podamos hacer algo como esto. Debilita cinta dio, y luego podemos inyectar en nuestro pequeño tipo de tarea como este consiguió cinta, valor de stock Así que se va a ejecutar esto en el simulador, ve cómo se ve. Pero en realidad, antes de que podamos hacer eso, casi me olvido. En realidad necesitamos hacer la configuración aquí. Por lo que el paso final va a estar cerca. Nuestro asistente de editor aquí, tabla de ustedes vende figura de pensamiento con tarea, y , uh, esa tarea va a ser algo que necesitamos para volver a la fuente de datos. Entonces lo que hacemos aquí es solo dejar ah, preguntemos igual fuente de datos en la ruta de índice punto ro. Y si recuerdas, yo estaba un poco pasando de esta manera antes, pero sólo estoy obteniendo explícitamente la tarea sólo para mostrarte que también puedes hacerlo así Si quieres ser un poco más explícito, um, y luego pasar la tarea así para hacer la configuración. Entonces ahora vamos a ejecutarlo. Y deberíamos tener todas nuestras fijaciones enganchadas con la nueva adición de nuestro subtítulo ligado a nuestra etiqueta. Y bastante seguro, se puede ver que estudiar programación codificación de sitios, hacer trabajo de casa tipo lavandería y planear viaje a España de tipo planeación vacacional. Todo parece estar funcionando 11. Construir el controlador de visión de creadores de tareas: ahora, en este punto del tutorial, definitivamente hemos hecho mucho progreso en nuestra lista de vista de tabla. Pero el problema que tenemos en este momento es que sólo tenemos tres artículos que son básicamente duros codificados . No tenemos forma de agregar dinámicamente nuevas tareas a nuestra lista, y eso es algo que vamos a arreglar en esta parte del tutorial eso. Lo que podemos hacer aquí es que tenemos una barra de navegación. Uh, podemos agregar un botón más a la parte superior justo aquí. Y básicamente, cuando hacemos clic en ese botón más, va a cargar otro controlador de vista. Eso nos va a permitir introducir una nueva tarea de lista para hacer en el formulario, y luego podemos guardarla y cargarla justo en nuestra lista de cosas que hacer automáticamente. Y así el primer lugar para empezar es volver a nuestro storyboard. Entonces lo que haremos aquí es que vamos a volver y bajar a la biblioteca de objetos aquí. No se trata de escribir elemento de botón de barra, y este es un tipo de botón que podemos agregar a una barra de navegación o a una barra de herramientas, y simplemente podemos arrastrarlo hasta aquí hasta la parte superior izquierda de la parte superior derecha, y eso nos dará un bonito botón que podemos usar desde aquí. Y una vez que tengamos nuestro botón seleccionado, notarás que aparece debajo del elemento de navegación, elementos de botón de barra derecha y luego el elemento real aquí. Y así si pasamos al inspector de atributos, podemos cambiar ciertos atributos a nuestro botón. Por ejemplo. A lo mejor en lugar de este estilo de selección personalizado, queremos hacer un anuncio que cambiaría ese icono a un icono más, cual es algo que tiene sentido para lo que estamos tratando de hacer. También podemos cambiar el intento del azul predeterminado a tal vez algo que se vea más apropiado para nuestro tema, que es amarillo y negro. Para que yo pudiera hacer algo así también. Y una vez que hayamos hecho eso, lo que queremos hacer ahora es conectar la acción del constructor de interfaces para cuando se toca o hace clic en este botón . Entonces si volvemos atrás y abrimos el editor asistente y ponemos nuestro storyboard en un lado y nuestro controlador de vista de tabla para hacer lista en el otro lado, podemos seguir adelante y crear esa acción. Entonces si como que bajamos a nuestro código aquí, solo escoges un lugar arbitrario y seleccionamos nuestro botón. Si mantenemos presionada la tecla de control, podemos hacer clic y luego arrastrar hacia nuestro archivo y desde el tipo de conexión desde outlet. Cambiaremos eso a acción, y solo llamaremos a esto crear, ah, nueva tarea tocada y conectarla. Y así realmente, en este punto es a donde vamos. En cambio, se comió el nuevo controlador de vista que necesitamos crear presentándolo totalmente. Y una vez que eso se presente, bueno, ingrese una nueva tarea en ese controlador de vista guárdelo y luego vuelva a cargar automáticamente. Ese día, esa tarea mu en nuestra lista. Ahora estamos listos para crear nuestro controlador de vista. Entonces vuelve a bajar a la biblioteca de objetos aquí. Vamos a arrastrar un nuevo controlador de vista al lienzo del storyboard, y este va a ser nuestro controlador de vista creador de tareas. Um, lo que voy a hacer aquí es que sólo voy a darle estilo amarillo y especie de la misma temática que hemos estado siguiendo para la app. Puedes elegir el color de fondo que quieras usar, así que solo lo voy a dejar así por ahora mismo. Y lo que necesito hacer a continuación es realmente crear el archivo de código fuente para este controlador de vista y de igual manera, que hicimos con los otros dos empezaremos creando un nuevo archivo swift. Y lo llamaremos a este controlador de vista creador de tareas. Bueno, entonces adelante e importa en tu kit, cual contiene la clase que tienes tú controlador. Y acabaremos de definir nuestra nueva clase como clase Creador de tareas. Pocos controladores de unidades cansadas de ti. Yo veo controlador y anularé la vista que carga como nuestro punto de entrada en este controlador de vista eso. Entonces una vez que hayamos hecho eso, um, si tienes tu editor asistente abierto aquí, podemos volver atrás y conectar, uh, uh, el archivo de código fuente para que se asigne al nuevo controlador y constructor de interfaces. Entonces si seleccionamos en tu vista, controlador, acabamos de crear vamos al inspector de clases aquí, podemos seguir adelante y para encontrar eso como creador de tareas de tu controlador y solo vamos a seguir adelante. Y también es que el storyboard i d y la idea de restauración en caso de que necesitemos hacer algo programáticamente más adelante. Y realmente, lo que debilita Dio es de aquí son nuevo botón plus. Podemos seguir adelante y hacer una presente opción de Mota Lee aquí mismo para realmente asegurar el controlador de vista creador de Newtown , uh, cuando ponemos ese botón. Entonces sigamos adelante y probemos eso en el simulador muy rápido y veamos cómo se ve eso. Y así mis simuladores se abren aquí y le doy a mi botón plus y allá vamos. Por lo que mi controlador de vista creador de pruebas carga. No obstante, ahora mismo, no tenemos forma de descartar esto porque no tenemos ningún botón Atrás ni ningún tipo de botón seguro. Entonces eso es lo siguiente que necesitamos implementar es la interfaz de usuario para el controlador de vista creador de tareas . 12. Interface de usuarios de la persona de la visión del: Entonces lo siguiente que tenemos que hacer es diseñar la interfaz de usuario para un controlador de vista creador de pruebas . Antes de poder hacer eso, necesitamos ver tipo de elementos que necesitamos agregar que se requieren para crear una tarea. Entonces si volvemos a la tarea dot swift en nuestra carpeta de modelos y miramos nuestra clase de tareas , podemos ver que hemos agregado tres cosas. Tenemos un título, tenemos una fecha de vencimiento y cuando tenemos un tipo de tarea. Entonces empecemos con el más fácil que será el título. Y lo que podemos hacer por eso se arrastra sobre un campo de texto. Entonces si vas al guión gráfico y en la esquina inferior aquí para la biblioteca de objetos, si escribes campo de texto, arrastra sobre un campo de texto hasta el guión gráfico, y este va a ser nuestro campo de entrada para nuestro título de tarea, entonces lo que podemos hacer aquí es empezar a tipo de posicionar esto, um, donde queríamos ir. Solo voy a conseguirlo aquí por ahora mismo. Y lo siguiente que hará es volver atrás y conectar la salida del constructor de interfaces para nuestro campo de texto aquí en nuestro controlador de vista. Así que vuelve al creador de tareas de tu controlador y justo arriba sí cargaste lo es Debilen Dio crear esa conexión. Entonces, manteniendo presionada la tecla de control, podemos hacer clic y arrastrar hacia el controlador de vista, y simplemente llamamos a este campo de texto de título de tarea. A continuación, seguiremos adelante y agregaremos dos campos de texto más, Así que sigamos adelante y arrastremos dos más. Entonces dragón Uno aquí y otro aquí y se iba a arrastrar esos hacia fuera. Entonces todos son iguales con hacer lo mismo otra vez para el 3er 1 Y lo siguiente que necesitamos es un botón para realmente invocar el proceso para crear una tarea. Entonces si empezamos a escribir para botón, arrastraremos el botón real que viene aquí no el botón de barra, sino el elemento, sino solo un botón. Entonces arrastramos eso sobre el guión gráfico, y podemos hacer aquí es en lugar del botón de texto. Podemos ir al inspector de atributos y escribir, um, crear tarea, crear tarea, y puedes arrastrar el ah dentro de la altura para conseguir un botón más grande ahí, y voy a cambiar el color de mi color de texto a negro. Podría seguir con el tema de nuestra app. Y también voy a cambiar esa fuente de texto aquí de costumbre, creo que voy a probar algo diferente. Um, así que Helvetica nueva es del tipo ahí, pero voy a ver sobre Ah, pero he instalado aquí Traven y luego haremos Ah, tal vez un pensamiento audaz aquí. Fuente más pesada si podemos. Bueno, es más grande Y sólo por ese mayor tamaño de fuente off drag que un poco más. Por lo que ahora tenemos la mayoría de nuestros controles de entrada creados. Lo siguiente que podemos agregar a tipo de darle a esto de ustedes el control un poco más pulido es un nombre como básicamente un título en una forma de salir de él. Porque no tenemos forma de despedir este controlador de vista ahora mismo. Por lo que probablemente la forma más fácil aquí sería agregar una barra de navegación. Y ahora te darás cuenta aquí. Cuando empecé a tener una navegación, verás el controlador de navegación y la barra de navegación. El principal diferencia es si recuerdas en los tutoriales anteriores, es el controlador de navegación es una forma especial de un controlador de vista que te proporciona la barra de navegación. No obstante, este es un controlador de vista que estamos presentando Motive Lee. No estamos y habíamos estado apostando esto en un controlador de navegación per se. Entonces cuando realmente cambiamos un Segway móvil como lo hicimos aquí, que tiene el botón más que lleva al Segway todo el camino para oírte recuerda que sale de abajo. No se empuja a la pila de la forma en que se hace cualquier otro controlador de vista dentro de un controlador de navegación . Pero todavía podemos simular el mismo tipo de look con la barra de navegación. Entonces si solo dragamos la barra de navegación en nuestro controlador de vista, lo que podemos hacer aquí es, ah, empezar a crear algo que tipo de todavía se vea similar. Pero se comporta en una presentación móvil. Entonces con la barra de navegación arrastrada por aquí en la parte superior, bueno, podemos. Entonces hacer es agregar en un botón para descartar esto. Entonces si empezamos a escribir por botón y mal escrito, pero en sus deberes, arrastraremos sobre una barra pero un elemento en el lado izquierdo de esta barra de navegación y lo que podemos hacer aquí es si seleccionas tu barra de navegación y vas y abres esa pequeño menú lateral en la parte inferior aquí, si realmente echas un vistazo a la jerarquía de la vista para el control Barra de navegación tiene un título, una barra izquierda, pero un elemento aquí con un elemento real dentro de ella. Entonces ese en realidad es este artículo, y tiene la capacidad de agregar también una barra derecha. Pero noche, um, si solo arrastráramos sobre otro elemento aquí, podríamos crear efectivamente otro botón. Pero realmente no necesitamos uno para éste. Sólo necesitamos una manera de salir de ella descartándolo. Entonces el de izquierda aquí es lo suficientemente bueno por ahora. Entonces lo que podemos hacer es empezar cambiando el título. Si seleccionas el título aquí y vas al inspector de atributos, tiene un texto predeterminado establece el título para que solo podamos llamar a esta nueva tarea o crear nueva tarea. Veamos cómo se ve. Entonces eso se ve bien. Um y luego si queremos cambiar también el texto para el botón real, si bajamos a la izquierda artículos de Barbara y luego seleccionamos el elemento real, que es el botón. Podemos ir aquí y cambiar algunos de los atributos en el inspector de atributos, por lo que ya verás aquí. Se pre carga con el texto del ítem bajo el título. Podemos simplemente cambiar el texto demasiado cerca, por ejemplo, y verás que lo actualiza aquí mismo. Otra cosa que podemos hacer es cambiar la carpa. Ahí está el azul es las carpas por defecto, pero si queremos mantener nuestro tema y cambiarlo al color de texto negro que funciona, aquí hay algunas otras opciones. Creo que hay una opción hecha, que estos son solo algunos de los predeterminados que Apple proporciona. Um, cancelar, deshacer. Guarda algunos de estos puedes usar fuera de la caja si quieres. Voy a deshacer eso solo porque quiero usar cerca también de hay diferentes estilos puedes usar frontera versus plano. Uh, realmente no muestran demasiado cambio visual en el storyboard, pero solo hay algunas opciones diferentes aquí que puedes cambiar así y ahora que tenemos la mayor parte de nuestro formulario lleno de manera, necesitamos empezar a conseguir todo en la posición adecuada. Específicamente, queremos tratar de mantener fijos estos elementos de control a alguien en el centro de la de la forma, pero necesitamos hacerlo un poco más elegantemente. El motivo por el que necesitamos preocuparnos por nuestro diseño es si seleccionas tu controlador de vista y bajas a la parte inferior aquí donde dice vista como y comienzas a escoger diferentes tamaños de dispositivo . Por ejemplo, estoy en el iPhone ocho. Pero si hice clic en, digamos sólo el iPhone S c y vuelves atrás, puedes ver que ahora todos mis elementos no están centrados. Lo mismo aquí. Si bajo a los cuatro s, se ve aún peor si subo al iPhone 10 aquí. También se ve un poco mal. Um, y en el iPad, será realmente que eso Eso es una especie de problema nuestro que queremos resolver es cómo construimos una interfaz que se vea bastante bien en todos los tamaños de nuestros dispositivos, y ahí es donde entra el diseño automático. Y específicamente podemos usar lo que se llama pila de ti, que maneja gran parte del apilamiento vertical u horizontal de elementos que se presentan de manera similar. Algo así, y nos permite no tener que implementar las restricciones. Suman meticulosamente un constructor de interfaces. Es tipo de maneja parte del auto layout para nosotros o lo hace un poco más fácil en DSO. Eso es lo que vamos a hacer a continuación es crear nuestra vista de pila para básicamente encapsular estos elementos y colocarlos verticalmente. Fue honestamente centrarlos en este controlador de vista. Entonces lo que tenemos que hacer es seleccionar todos nuestros elementos de control al mismo tiempo. Una cosa que puedes hacer es arrastrar una caja alrededor de ellos así, o puedes tirar hacia abajo la tecla Mayús y hacer clic en cada una de forma individual con la llave de los barcos mantenida pulsada . Y es como todos ellos al mismo tiempo y lo que tenemos que hacer. Antes teníamos la vista de pila, como queremos decir que queremos usar para ser los mismos con en lo alto que están en este momento , no queremos que cambien esos, así que podemos hacer aquí es bajar a este botón y agregar en un con ella por delante restricción, que lo suma para cada control individual que seleccionó en este grupo. Ahora te das cuenta de que todo está en rojo aquí porque tenemos básicamente restricciones configuradas que no son suficiente información para el diseño automático para saber dónde colocar estas cosas. Entonces por eso nos está dando errores o errores de restricción. Eso está bien. lo arreglaremos a medida que avancemos. Por lo que ahora que están a la altura para cada uno es fijo. Podemos incrustarlos en una vista de pila presionando este botón aquí, y notarás que todos están aplastados juntos. No hay más espaciado vertical entre ellos y ah, con con y la altura sigue siendo sin cambios, que es lo que queremos. Entonces ahora puedo arrastrar alrededor de la pila para ti. Y si miras aquí dentro del controlador de vista creador de tareas, amplían la jerarquía de vistas. Se puede ver que a medida que vas bajando, tienes tu barra de navegación y te entiendo. Y si lo expandes, ya ves, todos nuestros elementos se agregan en el interior de la misma. Entonces, ¿qué? Podemos hacerlo aquí, Así que en realidad seleccione nuestra pila para usted y tipo de posición en el centro aquí y lo que luego podemos hacer es ir al inspector de atributos aquí y empezar a mirar algunas de las propiedades para nuestra vista de pila, y se puede ver que hay un eje el cual se pone automáticamente vertical porque se detecta que hay una alineación. Y podemos aumentar el espaciado vertical presionando este botón de espaciado hacia arriba o hacia abajo para crear un espacio vertical entre sus elementos. De igual manera donde sepas puedes cambiar las opciones de distribución y alineación de estos desplegable aquí. Pero notarás aquí que todavía hay un montón de ah rojo en nuestras, um, guías de restricción, y verás que nos faltan restricciones para algunas cosas diferentes. Exposición de por qué se desconoce la posición para todos los campos de texto de título de tarea porque en realidad, las únicas restricciones que tienen sobre ellos o las dentro de las alturas que agregamos. Todavía no hemos agregado ninguna restricción a nuestra pila pocas, así que eso es lo que tenemos que hacer en este momento. Y la forma más fácil para nosotros de censurar todo aquí es centrar horizontal y verticalmente la pila nueva. Entonces si seleccionas tu vista de pila desde aquí, que la resalta aquí y bajas a este botón aquí para el Alinear. Lo que haremos es seleccionar el horizontalmente en contenedor y verticalmente en contenedor y agregar estas restricciones y verás aquí que tipo de posiciones Esas lo mueve un poco hacia arriba y lo que podemos hacer aquí es intentar arrastrar esto hacia fuera. Entonces ese es el verdadero centro de esta pantalla aquí. Y parece que tengo un poco demasiado espacio vertical entre mi elemento. Entonces voy a disminuir eso un poco más en el inspector de atributos aquí, intenta que ese look sea un poco más limpio. Ya sabes, pienso en los años veinte 20. Debería ser bueno. Um, así que vamos a, ya sabes, asegurarnos de que eso es bonito y centro ahí, y vamos a ver aquí si tenemos algo más de advertencias rectas S o.Esto es sólo decir que el fijo con restricciones en el botón puede causar problemas de recorte . Eso podemos cambiar esto aquí o puede ser innecesario por lo que podemos quitar esa restricción en sólo porque usted nota aquí que el botón es ahora exactamente el con del texto en él con sólo la restricción de altura aquí, Um, y si miramos hacia atrás nuestras advertencias, se han ido todos. Por lo que hemos dado como resultado todos nuestros problemas de restricción de diseño automático que teníamos también a Necesitamos arreglar la barra de navegación a la parte superior del controlador de vista porque no se le agregan restricciones . Entonces igual que la barra de navegación aquí en la jerarquía Esta es un poco más fácil Lo podemos hacer es bajar a, uh, uh, el botón de restricciones aquí para nuevas restricciones. Y solo fijaremos este a la parte superior, a la izquierda o a la delantera en el lado derecho o a los bordes posteriores y agregaremos las restricciones de historia justo ahí y eso bloqueará eso en su lugar. Entonces ahora, con si vamos y empezamos a verlo en diferentes tamaños de dispositivo, puedes ver que si selecciono el iPhone para nosotros, nos vemos bien. Si vamos a mirar el iPhone S e se ve bien, y vamos a verificar las cosas en el iPhone. 10 se ven bien aquí, también. Se ve bien. Busquemos al ocho. Incluso echemos un vistazo a eso esta noche, y a ver cómo se vería ese laico en el iPad. Y así todo centrado y eso es exactamente lo que queremos 13. Configurar los IBOutlets e IBActions para el control de vistas de grupos de grupos de tareas: ahora que tenemos todo dispuesto en posicionado, queremos seguir adelante y empezar a conectar, son ustedes elementos y está implementando el despido real de este controlador de vista cuando se toca el botón de cerrar. Entonces lo que podemos hacer es pasar a la tarea de tu controlador aquí, y vamos a mantener todo lado con storyboard en un lado y el código en el otro, y vamos a empezar a enganchar nuestros controles. Entonces si entramos en el controlador aquí, esta pila, esa tarea creadores de tu controlador, empecemos con el botón de cerrar para que podamos seguir adelante y tener eso seleccionado aquí. Y podemos crear eso. Ser acción agregando la pulsación de la tecla de control y luego haciendo clic y arrastrando sobre. Y voy a poner el mío justo bajo carga vista. Pero desde la toma de corriente cambiará el tipo para la conexión a la acción. Y solo llamaremos a este botón de cierre tocado. Y mientras estamos en ello, sigamos adelante y empecemos a sumar en los otros también. Empezaremos con el campo de texto del título, así que haremos lo mismo. Wilken mantenga presionada la tecla de control y luego arrastre sobre y cree una conexión para, um campo de texto título. Haremos lo mismo para todos por debajo del campo de texto de tipo de tarea y para el texto final. Campo también hará el mismo campo de texto de fecha de vencimiento enfoque, y luego finalmente creará la acción adicional aquí para crear la tarea tan bien. Control, teclea y mantenga pulsado, haga clic y arrastre sobre. Y como esto es un botón, vamos a cambiar el tipo de conexión de salida a acción, y solo llamaremos a esto crear tarea mantenida ahora, cuanto a implementar el código aquí, probablemente la pieza más fácil de implementar. Simplemente impugnamos que todo está funcionando es el botón de cierre real que se está tocando en sí mismo. Eso Lo que podemos hacer aquí es cuando se toca el botón de cerrar para cerrar realmente el controlador de vista o para descartarlo. Es simplemente esta línea de código llamada descartar. Entonces en el método de toque de botón cerrar Will tecleará en Smith y verás aquí que la descripción dice descarta el controlador de vista que fue presentado Motor Lee por el controlador View . Entonces el que hubiera presentado esto era su do list tabla vista Controller on bat va a ser despedido una vez que toquemos este botón aquí. Por lo que todo conjunto animado verdadero. Y hay un manejador de terminación para cuando se hace el despido que básicamente es una devolución de llamada diciendo que está terminado que su misil. Pero no vamos a estar haciendo nada ahí para que podamos pasar nada, ya que ese es un parámetro opcional. Y ahora sigamos adelante y en realidad ejecutemos esto en el simulador y veamos cómo se ve. Simplemente voy a cambiar a mi iPhone en el mar y empezar eso aquí arriba y vamos a ver qué tenemos . Entonces mis simuladores se abren ahora, y voy a seguir adelante y presionar el botón más para crear una nueva tarea. Y puedes ver aquí que mi, uh, menú aparece y, ah, si tengo mi ropa Pero aquí desecha el controlador de vista volviendo arriba, Um, vuelve enseguida. Entonces ahora que podemos descartar se presentan controlador de vista creador de tareas, lo siguiente que vamos a querer hacer es empezar a configurar los campos de texto. Eso comenzando con el campo de texto de título. Queremos asegurarnos de que cuando realmente hacemos clic o tocamos el campo de texto que seamos capaces de sacar el teclado simulado o el teclado de software para luego poder escribir algunos textos, presionar la tecla de retorno y luego con éxito descartó el teclado eso para empezar con eso, Lo que vamos a hacer aquí es dentro de una tarea Creador view controller creará una nueva función aquí abajo y llamaremos a este funk privado configurar campos de texto. Y cuando se ve carga se llama bien, en realidad llame a este método para empezar a configurar nuestros campos de texto. Y lo que vamos a tener que hacer aquí es configurar el delegado de campo de texto. Entonces si recuerdas el controlador de vista de tabla, uh, para que nuestro hacer lista controlador de vista de tabla, volvamos atrás y echemos un vistazo rápido a algo ahí dentro. Vamos a entrar, revisitar el concepto de delegados y delegación. Onda realmente implementa manualmente un delegado en tan solo un momento aquí. Entonces si volvemos aquí y hacemos click en el controlador de vista de tabla U I, recordarás que teníamos au I table view delegado. Ahora no tuvimos que hacer nada porque el controlador de vista de tabla implementa automáticamente esto para nosotros. Pero es un protocolo, y de igual manera, si haces clic en un comando haciendo clic en ti, yo campo de texto y saltando a la definición aquí. Um , también cuenta con un delegado. Entonces si buscamos delegado, hay un delegado de campo tú yo texto. Y si echamos un vistazo a lo que se define en este protocolo, tiene todos los métodos que se van a llamar un notificado para cuando sucedieron cosas diferentes con el campo de texto, como cuando comienza la edición, el termina edición, se presionó la tecla de retorno, y esto nos da todos los puntos de disparo para hacer ciertas cosas que necesitamos hacer con nuestro teclado y descartarlo y qué no? Um y así cómo realmente vamos adelante e implementamos al delegado es bastante simple. Lo haremos es volver a nuestra tarea creador de tu controlador aquí y dentro de nuestro método de configuración de campos de texto. Empezaremos con el campo de texto de título, y tiene la propiedad de delegado de puntos y diremos que el delegado para este campo de texto va a ser igual a self y self simplemente significa controlador de vista creador de tareas. Esa es la clase que estaban dentro. Entonces lo que realmente estamos diciendo es que nuestro controlador de vista creador de pruebas va a ser el delegado para cualquier cosa para los campos de texto U I en esta clase. Entonces, en cualquier momento que las cosas cambien, uh, las interacciones de campo de texto ocurren esas tareas o esas notificaciones o, um, devoluciones de llamada se reenviarán al controlador de vista creador de tareas que es el actor delegado. Y así la forma realmente implementará los métodos aquí porque se puede ver que ya estoy recibiendo un error Eso dice que no puedo asignar este valor aún es porque el controlador de vista creador de tareas tiene que ajustarse al protocolo. Usted yo delegado textual. Y así lo que podemos hacer es crear una extensión en el controlador de vista creador de tareas Que se ajuste al protocolo. Tú me texto delegado de campo y asume que hago esto. Vas a ver que ese error va a desaparecer ahora. ¿ Por qué hice esto en la extensión? Bueno, yo también podría haberlo hecho fácilmente aquí arriba. Podría haberte hecho yo delegado textual, pero tiene buenas prácticas, sobre todo para rapido. Es muy común envolver tu protocolo, conformidad o implementaciones dentro de una extensión en lo que sea en lo que estés trabajando para especie de mantener separadas las responsabilidades para que pueda manejar todos los métodos de delegado de campo de texto U I dentro de esta extensión. Eso es separado de todo lo corelogic que está pasando aquí en el controlador de vista, tipo de mantenerlos aislados y simplemente mantener las cosas modulares. Y ya sabes, esta una separación de preocupaciones solo es una buena práctica para una programación rápida, rápida, y yo un menos así Ahora tenemos que averiguar qué métodos aquí tenemos que implementar? Porque de nuevo, si volvemos atrás y echamos un vistazo al delegado de campo de texto, prácticamente todo aquí dentro es opcional. Lo que significa que no tenemos que implementar estos debilitar solo conformarnos al protocolo como lo hice yo y no hacer nada si quisiéramos. Pero a pesar de que eso no tiene sentido, tenemos la opción de implementar cualquiera de estos o ninguno de ellos, dependiendo de lo que estemos tratando de hacer. Entonces el obvio que absolutamente necesitamos es Text Field debería regresar, y vamos a devolver verdadero aquí y analizar qué hace este método y por qué lo necesitamos en DSO. Lo que está pasando aquí es que Miss incluso puso la documentación seleccionando este método, y si voy al lado derecho aquí, a veces no lo muestra de inmediato y ex código. Pero a ver si puedo saltar a la definición de esto aquí, Um, ver aquí saltar Teoh. Por lo que dice que se llama cuando se presiona la tecla de retorno. Devolver no para ignorarlo, y proporciona el campo de texto con el que se interactuó. Entonces, si hacía clic en el campo de texto del título y presionaba la clave de retorno, este campo de texto sería técnicamente el campo de texto del título. Lo mismo para la fecha de vencimiento. Lo mismo para el campo de texto de tipo de tarea. Y así si quiero descartar ese teclado, todo lo que haré es decir en este campo de texto provisto de este método delegado. Renunciar al primer respondedor, y eso es básicamente decir que renuncian al elemento que está enfocado ahora mismo y lo descartan , que en ese momento sería el teclado. Y la documentación probablemente lo pueda explicar mejor que yo, donde dice que notifica a este objeto al que se le ha pedido que renuncie a su condición primer respondedor en su ventanilla en DSO. Ahora, si seguimos adelante y ejecutamos esto en un simulador, veamos cómo va a quedar esto. Entonces mis simuladores se abren aquí voy a entrar al controlador de vista creador de tareas, y necesito asegurarme de que mi teclado se haya encendido aquí porque, um, um, bien, parece que lo es. Pero ahora si presiono la tecla de retorno, ver cómo la está descartando? Por lo que hago clic en teclado aparece tecla de retorno para hacer negocios. Ahora si intento lo mismo para los otros dos campos de texto, mira, no es que no está descartando. El motivo por el que no está descartando es que sólo he diseñado la delegada para ésta, lo que significa que la devolución de llamada para despedir su devolución que básicamente estás despedido. El teclado no disparará para los otros dos campos de texto hasta que también asigné al delegado la misma manera que hice el campo de texto de título. Y entonces eso es algo que todavía tenemos que hacer aquí en otra cosa, también. Si no ves en el simulador tu teclado viniendo porque esto es un ajuste, tienes que encender ir al hardware, buscar teclado y asegurarte de que tenías el teclado de software de toggle como el mío estaba funcionando, pero debería han sido ah, volvemos allá y nos aseguramos de que, um bien, Ok, seguirás adelante y dijiste eso para asegurarte de que puedas alternarlo. Ahora sigamos adelante y hagamos lo mismo para los otros dos campos de texto y asignemos a sus delegados para que podamos volver de inmediato a ese método de configuración aquí e ir fecha de vencimiento. Delegado de campo de texto es igual a self y tipo de tarea campo de texto, no delegado es igual a self. Ahora sigamos adelante y corremos en el simulador una vez más y veamos si podríamos descartar los teclados para los tres campos de texto ahora. Entonces entrando en el controlador crear nueva vista de tareas, si bajo al otro campo de texto aquí y presiono la clave de retorno, se puede ver que desecha. Es no. Si voy aquí abajo en el 3er 1 golpeó la tecla de retorno, podría ver que también rechaza. Por lo que todos estos aires ahora funcionando correctamente debido a enganchar a los delegados para cada uno de ellos. Ahora echemos un vistazo a algunos de los atributos de un tú un campo de texto, así que vuelve al creador de tareas de tu controlador y selecciona uno tus campos de texto y ve al inspector absoluto aquí. Y echemos un vistazo a algunas de las propiedades que tenemos disponibles. Por lo que además de texto, color y fuente, también podemos cambiar, como la posición del texto alineado a la izquierda centro Landry el león justificado. Por lo que probablemente queremos que nuestro texto esté centrado sólo porque simplemente visualmente va a parecer más atractivo. Um, y también hay esta opción aquí para texto de marcador de posición. Ahora, texto de marcador de posición es básicamente un prompt para morir el usuario para hacerles saber qué tipo de texto o qué información debería estar poniendo en el campo. Entonces ah, buen ejemplo de marcador de posición aquí sería Enter Task title y generalmente esto se utiliza para mostrar el constructor de interfaz abierta . No sé por qué ya no lo es. Ah, lo veremos cuando lo ejecutemos. Pero esto solía aparecer también aquí también de vuelta en las versiones anteriores de X good, um y ah, oigamos volver a ese 1er 1 de aquí. También puedes cambiar el estilo de borde si quieres, por lo que tienes un borde claro tipo de borde rectangular con un contorno negro, borde empotrado. Ese tipo de parece que está empotrado hacia adentro, y luego el predeterminado, que es el redondeado que ya hemos estado usando. Aquí también hay muchas otras propiedades. Otro interesante es el tipo de teclado, los teclados predeterminados. Lo que viste, donde teníamos las letras y los números. Pero también puedes cambiarlo para que sea solo una almohadilla numérica o una almohadilla telefónica. Um, s así que esa es una forma en la que puedes configurarla desde dentro de la interfaz Builder. Aquí hay mucho. Muchas opciones, sobre todo la clave de retorno. Se puede cambiar la clave de retorno a otra cosa tal se hace o siguiente, o cualquiera de estas opciones disponibles en lugar de simplemente devuelta. Y también hay un teclado. Mira, hay uno oscuro, uno claro. Entonces, um, intentémoslo. Cambiemos los nuestros. Demasiado oscuro solo para ver cómo se ve eso. Um, también dos. Probablemente queremos establecer los otros dos campos de texto para que tengan el mismo tipo de estilo tan ominoso que el teclado se vea demasiado oscuro para el, um, medio y el teclado. Busca oscuro para el 3er 1 También para tener un anuncio, el texto de marcador de posición para éste. Entonces creo que probablemente diremos tipo de tarea aquí. Entonces para el texto de marcador de posición hará entrar cinta de tareas y para el 3er 1 aquí hará Entrar fecha de vencimiento de la tarea Y ahora sigamos adelante y ejecutemos esto en el simulador y veamos cómo se ve . Entonces los simuladores abren aquí y ah, tengo mi título de tarea aquí Y eso es lo que el oscuro ah, teclado. Y parece que se me olvidó centrar el texto en el segundo y tercero 1 pero sin preocupaciones. Debilitar. Haz eso de verdad rápidamente. Te das cuenta aquí que es el teclado temático oscuro, y aquí verás el texto del marcador de posición. Y a medida que empiezo a ingresar texto como una nueva tarea, el texto de marcador de posición desaparece. Si elimino mi texto, el texto del marcador de posición vuelve. Uh, y yo sólo arreglaré a mis otros. Te texto campos muy rápido por dis entrando en su alineación. Y ahora que se ven igual que el 1er 1 14. Presentación de UIPickerView: Por lo que ahora necesitamos terminar de recopilar la entrada del usuario de nuestros campos de texto y luego crear una nueva tarea en descartar el controlador de vista y para seleccionar elementos de una lista. IOS realmente no tiene el concepto de un menú desplegable como probablemente has visto en Web APS o incluso una aplicación para Android. Lo que tenemos en su lugar es la vista tú yo seleccionador, y eso permite a un usuario hacer una selección en una lista de hierbas de desplazamiento en lugar de tener que introducir datos desde cero como lo harían. Cualquier campo de texto blanco y el campo de texto de fecha de vencimiento en este campo de texto tipo casa te van a necesitar. Escojo críticas para selección, así que echemos un vistazo al campo de texto U I. En más profundidad, adelante y comanda. Haga clic en el campo de texto para saltar a la definición y buscar vista de entrada en la clase de campo de texto U I . Y esta va a ser la vista que se presenta cuando se toca el campo de texto o entra en foco en la cadena de respondedores. Y esencialmente, va a traer una vista U I picker que vamos a configurar con nuestros tipos de tareas o fechas de vencimiento. Y luego una vez que un usuario haga una selección, recordará lo que seleccionó. Y esos van a ser los datos que vayan a crear la nueva tarea. Entonces volvamos a nuestro controlador de vista para el creador de tareas y empecemos a configurar esta configuración . Entonces lo primero que vamos a hacer es empezar por crear una nueva propiedad, y vamos a llamar a esta fecha de vencimiento de bar privado o a una foto tipo de tareas tuya. Va a ser un tipo que yo recogedor ver. Seguiremos adelante y declararemos eso opcional porque necesitamos configurarlo primero. Entonces lo que haremos aquí es dentro de los métodos de campo de texto configure, uh, están en para sus campos de texto. No es que sigamos adelante y configuramos eso para que hagamos tipo de tarea Picker View te iguala. Tengo una foto tuya para crear una nueva instancia de la misma y lo que vamos a hacer a continuación. Ya que vamos a empezar con el tipo de tarea, el campo de texto de tipo de tarea delante de usted va a igualar la vista de selector de tipo de tarea. Y ahora vamos ah comandos Haz clic en ti. Escojo, reviso y golpeo salto a la definición y le echo un vistazo a esta clase y veo qué es. Por lo que enseguida podemos ver aquí mirando la cadena de herencia que tú escojo revisión deriva de una u yo veo. Y esa es la razón por la que pudimos asignarlo como la entrada de ustedes porque en última instancia hereda a todos los ustedes. He usado propiedades y en la cadena de herencia aquí. Ahora, para la revisión yo escojo en sí, tiene sus propios componentes y personaliza las ations aquí y realmente dos cosas importantes para tomar nota de nuestro delegado en la fuente de datos. Eso es como lo hicimos con el delegado de campo de texto U I. Vamos a implementar el delegado en la fuente de datos manualmente en nuestro controlador de vista creador de tareas eso Vamos a seguir adelante y empezar a trabajar en eso ahora. Um, así que ya hemos ido adelante y le asigna la vista de entrada aquí, pero lo siguiente que tenemos que hacer es configurar al delegado en la fuente de datos. Entonces lo que haremos es un campo de texto tipo tarea. Lo siento. Tipo de tarea vista Selector Inicio delegado igual auto y tipo de tarea seleccionador ver fuente de datos Igual , auto, y vamos a obtener un aire de compilación bastante rápido aquí porque no hemos conformado tarea creador de ti controlador a estos protocolos on, igual que hicimos aquí en el delegado de campo de la U. S. S. X. Vamos a hacer exactamente lo mismo para la vista del picker, así que vamos a seguir adelante y crear otra extensión aquí. Extensión sobre tarea Creador. Se puede hombro se va a conformar a dos cosas se va a conformar a la fuente de datos de la U I. Picker vista en los protocolos de delegado de U I picker y, ah, la obligatoria que tenemos que implementar es la fuente de datos. Y así sigamos adelante y comandamos. Haga clic en él, salte la definición y vea lo que necesitamos para hacerlo en este en éste. ver aquí te seleccionador ver fuente de datos A veces código X, uh, se rompe cuando comandos haga clic en las cosas. Entonces e encontró aquí el protocolo, y las dos cosas que tenemos que implementar que no son opcionales son el número de filas y el componente y el número de componentes. Y entonces eso es bastante básico, ¿verdad? Uh, incluso aquí, si no estás seguro de qué es un componente, básicamente es una columna de datos escalables, y veremos bastante rápido una vez que tengamos esto enganchado para que podamos empezar con eso ahora mismo . Entonces vamos a empezar a escribir número de filas componente, y sólo vamos a devolver cero por el momento y una serie de componentes, que por ahora sólo vamos a convertir uno ahora, Hasta ahora, tan bueno Eso nos va a hacer más allá de la compilar error que habríamos tenido aquí mismo. Pero aún tenemos que seguir adelante y realmente construir la matriz o la fuente de datos que se va a alimentar alimentado en básicamente esta imagen de ustedes. Y así si volvemos aquí arriba, uh, uh, ya que estos son todos tipos de tareas, lo que podemos hacer es crear una matriz privada. Tan privados, vamos a tipos de tareas, ya sabes, sólo tenemos estos tipos string de ser realmente saben lo que vamos a hacer. ¿ Tipo de tarea? Bueno, comprando el valor de cadena. Um, y esto va a igualar tarea o codificación de puntos Tienes planeación vacacional punto estudiando en esa casa trabajo para todos los diferentes tipos de tareas que apoyamos. Y así ahora esta va a ser nuestra fuente de datos que contiene cuatro elementos donde las cuatro tareas diferentes disponibles para nosotros y es lo que vamos a hacer aquí es volver a bajar al número de filas y vamos a devolver la fuente de datos o las cintas de tipo de tarea que contar. Y así de inmediato aquí eso es decir que deberíamos tener cuatro ítems son foto tuya porque hay cuatro ítems en la fuente de datos real misma. Ahora que las fuentes de datos se engancharon, vamos a explorar realmente el tú. Me imagino de usted delegado y veo qué hay aquí dentro. Entonces si comandamos click en él y saltamos una definición cuando te buscamos, elegí su delegado de vista. Aquí podemos encontrar el protocolo, y notaremos que un montón de cosas aquí tipo de relacionadas con el podría la configuración visual del control como el con para un componente, la altura de fila para el componente, el título para la fila, uh, la vista para la fila. Y luego si realmente hiciste una selección en fila, todos esos aire disponibles aquí. Entonces los que vamos a necesitar nuestro sí seleccionaron fila y título para carretera. Vamos a implementar esos métodos ahora mismo. Entonces volvamos a nuestro controlador de vista aquí y empecemos a trabajar en el por lo que hemos manejado esta partícula. Ahora estamos a punto de empezar a manejar este protocolo. Entonces si comienzas a escribir título para fila, recuperarás el título para el método de componente de carretera. Aquí, Noser devuelve una fuerza opcional. Adicionalmente, si comienzas a escribir, sí seleccionaste, volverás. seleccionó fila y Componente, y también vamos a implementar eso. Por lo que sabemos cuándo se ha realizado una selección y obtener el ítem seleccionado del usuario. Entonces lo que tenemos que hacer aquí es lo que se nos da? Se les dio una foto de ustedes se les dio la fila real y se les dio el componente real, que en nuestro caso, solo hay un componente por ahora mismo. Entonces realmente, todo lo que necesitamos es la fila para averiguar qué seleccionaron. Por lo que podemos decir que dejar tarea seleccionada es igual a los tipos de tareas en la fila seleccionada. Y luego qué? Debilitar Dio es retorno Tarea seleccionada y deletreé eso mal. Corregir que la tarea seleccionada devuelva el valor bruto de punto de la tarea seleccionada o el valor de cadena de R E newme para la tarea. Y ahora tenemos todo enganchado para ver realmente cómo se verá esto. Adelante y ejecutemos esto en el simulador y echemos un vistazo rápido a lo que tenemos hasta ahora. Así que de vuelta en el controlador de vista creador de tareas aquí. Si sigo adelante y selecciono el tipo de tarea haciendo clic en él, verás Aquí tienes una foto tuya. Por lo que ahora tenemos las tareas seleccionables reales por las que podemos desplazarnos, como las tareas domésticas, el estudio, estudio, planificación de vacaciones y la codificación. Uh, y sin embargo, no hay forma de descartar esto ahora mismo. Nuestra camioneta. Está un poco atascado porque si recuerdas con los campos de texto, podríamos simplemente presionar la tecla de retorno para descartarlos con nuestra selección de ustedes. Al menos por el momento, no tenemos forma de salir de ella porque no está jugando por las mismas reglas que estaba haciendo el delegado de campo de texto en el campo de texto debería devolver método aquí, pero sin preocupaciones. Realmente hay dos formas en las que podemos manejarlo con bastante facilidad. Y si volvemos al método de carretera did select aquí, una cosa que podemos decir es una vez que hayan hecho una selección, podemos seguir adelante y descartar esa foto tuya. Pero tal vez te estés preguntando ¿cómo haríamos eso en la vista? Hay un método de edición de vista, no de fin. Y si seguimos adelante y echamos un vistazo a la documentación para esto haciendo clic de comando y saltando a la definición, se utiliza para hacer que la vista o cualquier sub vista que sea el primer respondedor renuncie. Y eso es importante porque cada vez que estos campos de texto muestran su teclado donde muestran sus vistas de entrada como lo está haciendo la vista del picker, ese es un primer elemento de respuesta, y está respondiendo. Es lo primero que responde a la entrada del usuario en la cadena desde los primeros respondedores, básicamente, y al forzarlo a terminar o llamando a visto y editando set a true, va a descartarlo automáticamente sin importar cuál sea el tipo que sea abierto en ese punto. Y vamos a ver si hay incluso Sí, vale, vale, así que desde la opción de rápido arriba aquí, incluso hay algo más de documentación. Este método mira la vista actual y su abuso de alguna jerarquía de vistas para el campo de texto que actualmente es el primer respondedor. Si encuentra uno, pide a ese campo de texto que renuncie a su primer respondedor, y si el perímetro de fuerza establecido en verdadero nunca se le pregunta al campo de texto, se ve obligado a renunciar. Entonces ahora si ejecutamos esto y antes de ejecutar, hará 11 otra cosa aquí es vinculará el tipo seleccionado al campo de texto de tipo de tarea. Entonces, lo que podemos hacer aquí decir tipo de tarea campo de texto punto propiedad de texto es igual al seleccionado o los tipos de tarea para la fila. Y vamos a vincular el valor de rob, que es esta fuerza a la propiedad de texto real aquí. Y así vamos a ejecutar esto ahora en el simulador y echemos un vistazo rápido a lo que va a dio. Entonces aquí vamos. Tengo que hacer una selección para estudiar y se ve que una vez que se hace la selección, se muestra aquí en el campo de texto en la pick de ustedes se despide automáticamente. Y si lo cambio de nuevo a trabajo de casa, misma cosa volver a codificar seleccionado y despedido 15. Construir el UIDatePicker: Ahora estamos listos para reunir la última pieza de información del usuario, y esa es la fecha de vencimiento para la tarea. Entonces, como hicimos con EU, una foto de ustedes iba a usar un selector de citas U I, que se parece a una vista tú yo recogedor. Pero mucha de la lógica en cuanto al delegado y el protocolo la maneja Iowa para nosotros. Entonces lo que empezará haciendo es agregar una barra privada de do selector de fecha y el tipo serás tú, yo selector de citas. Y la forma en que vamos a configurar esto es muy similar a cómo hicimos el tipo de tarea. Entonces si bajamos al método configure text fields, podemos seguir adelante y empezar a configurar eso. Por lo que podemos decir que el recolector de fecha de vencimiento es igual a una nueva instancia de un recolector de fechas U I. Y entonces lo que haremos aquí es en realidad echar un vistazo a esta clase y ver qué hay dentro de ella. Entonces comando flick y luego salta a definición de ti. Yo fecha picker y podemos ver de inmediato que de esta clase hereda de ti controlo y s codificación. Y tú controlo es otro vaso intermediario Entre tú, yo veo Y tú, yo salicero que tiene más control o propiedades relacionadas. Entonces si retrocedemos un nivel aquí en el selector de fechas u I, notamos que algunas de las propiedades tenemos nuestro estado de ánimo selector de fechas Ah, locale calendario zona horaria la fecha Ah, en unas cuantas cosas diferentes respecto a fecha mínima fecha máxima fijando la fecha, etcétera. Notarás que no hay delegado ni ah, fuente de datos que tengamos que implementar aquí. Y como dije al principio, IOS prácticamente maneja esto por nosotros. Eso Es un poco fácil de usar una foto tuya para las fechas Ahora también está el modo selector de fechas . Tienes tiempo fecha ocho y tiempo y temporizador de cuenta regresiva. Vamos a usar fecha para la nuestra. Entonces lo que haremos es volver atrás y en nuestro selector de fecha de vencimiento, ¿haces selector de fecha no fecha modo selector igual fecha fecha de punto Y una vez que lleguemos ahora vamos a ir a nuestro campo de texto, que es el campo de texto de fecha de vencimiento y lo que vamos a hacer para firmar la vista de entrada igual al seleccionador de fecha de vencimiento. Y nuevamente la razón por la que esto funciona es porque, como acabas de ver, la vista de entrada es tu vista. El recolector de fecha de vencimiento hereda de ti controlo lo que hereda de ti, veo. Por lo tanto, podemos asignarlo directamente a ah vista no, no se hacen preguntas. Entonces en ese punto, uh, todavía hay un poco más que tenemos que hacer respecto, um, realmente manejar la selección. Entonces una cosa más a la que quiero echarle un vistazo está dentro de ti. Yo controlo Esto también nos permite sumar básicamente eventos. Entonces al igual que nosotros, um, manejamos clics de botón y el guión gráfico seco ser acciones. También podemos agregar manejadores de clic de botón problemáticamente, y eso se hace a través de add target. Y así, como estamos en Stan Shading se controla programáticamente, tenemos que asegurarnos de que conectamos el valor seleccionado cambiado o el manejador programáticamente también. Tres. Agrega objetivo, que viene de ti. Yo controlo y no es de extrañar, tú yo botón también deriva de ti. Yo controlo, que es como es capaz de conseguir los clics de botón a través del at target también. Entonces volvamos atrás y veamos cómo se va a ver esto atrás y tarea Creator view controller . Tendremos que hacer aquí es fecha de vencimiento recolector subir la línea aquí. recolector de fecha de vencimiento Dios tenía objetivo y el objetivo va a ser yo mismo. Es estos House Creator view controller. Entonces estamos agregando este objetivo a esta clase, y esto va a ser una acción o un selector. Y el formato para esto va a verse como este selector de hashtag y el nombre de la clase, que, en este caso es creador de tareas, controlador de vista, y luego necesitamos darle un método que va a ser invocado. Entonces aún no he creado ese método, pero vamos a ir bien. Llámalo. Vamos a llamar a este nuevo método fecha seleccionada. Ya sabes, solo lo llamamos, um, fecha aquí y para la u controlo eventos. Vamos a usar el valor del pensamiento cambiado. Y si echamos un vistazo a esto pero comprometido haciendo clic en el valor cambiado aquí, si pudiera entrar ahí, volveremos a esa esta compilada porque aún necesitamos agregar ese método. Por lo que el método que necesitamos agregar es funk fecha seleccionada te d picker. Bueno, en realidad llama a esto solo para que quede claro Fecha, fecha recolector. Pero estás aquí, ¿de acuerdo? Y vamos a necesitar hacer una cosa más para que esto funcione listo para sumar en O B J c aquí y déjame ver qué dice este aire. Entonces bien, aquí s su primera instancia Método fecha seleccionada que no se expone al anuncio de objetivo C en O B J C. Para exponer este método de instancia al objetivo C. Así que si golpeamos, arreglamos automáticamente Qué lo vas a ver aquí es va, uh, poner en O V J c frente al método aquí y verás que esa advertencia desaparece. Entonces voy a mandar ser y construir realmente rápido y verificar que todo se compila. Y quería echar un vistazo aquí a este valor cambiado y vamos a ver si puedo encontrar eso fácilmente aquí, Um, buscar valor cambiado aquí mismo. Por lo que hay diferentes tipos de eventos ew en los eventos de de Estados Unidos control de Estados Unidosgolpeados aquí. Nos interesa escuchar en cualquier momento el valor cambia. Básicamente, cuando el usuario selecciona una fecha diferente, se va a llamar a este evento, pero hay otras cosas a que hay toque. Cancelar retoque exterior retoque hacia arriba dentro, que se usa comúnmente para ti. Yo botones, toque, arrastre un montón de cosas diferentes aquí que vas a querer echar un vistazo y ver lo podría tener sentido para lo que estás tratando de dio si estás haciendo programático Uh uh, selectores de la forma en que nosotros lo acaba de hacer. Entonces volvamos atrás. Y ahora que tenemos todo eso enganchado, pero lo podemos hacer aquí es imprimir fecha picker consiguió fecha y vamos a seguir adelante y ejecutar esto realmente rápido en el simulador y verificar que todo está funcionando como se esperaba. Está bien, así que sigamos adelante y dejemos esto y veamos si surge nuestro control y sí lo hace. Se puede ver que tiene tres componentes. Tiene un mes. Tiene un día y tiene un año. Entonces si seleccionamos, digamos abril ahora notarás que ese método seleccionado de fecha que agregamos programáticamente a través de este método de destino de anuncios aquí solo fue invocado porque se disparó el evento de cambio de valor . Entonces ahora si imprimimos la fecha de punto selector de fecha aquí mismo, veamos qué tenemos y parece para el 18 2018 ahora, eso está bien. Realmente no quiero usar ese formato innecesariamente. Entonces lo que podemos hacer es usar una fecha para la materia para dar formato a la fecha que vuelve a un formato que se ve un poco más bonito. Y luego combinamos eso con el campo de texto. Entonces para formatear, la fecha, el formato que creo que será el más fácil de usar aquí será este tipo de formato capital . Mm, dd ¿Por qué? ¿ Por qué? ¿ Por qué? ¿ Por qué? Entonces eso va a aguantar para el mes, el día y luego el año número 44. Y así la forma en que nos conformamos en la fecha que regresa es mediante el uso de una fecha para la materia. Por lo que sólo haremos flett Fecha por materia igual fecha antes de materia. Y luego estableceremos el formato a esa cadena. Acabo de escribir el comentario. Entonces fecha para la materia punto ocho formato que es igual No, solo usa esto exactamente como es porque es el formato correcto que cadena ahí. Y entonces lo que haremos es dejar que la fecha formateada sea igual a fecha para la cadena de punto de materia a partir del día y la fecha que va a volver es del selector de fecha aquí. Por lo que básicamente está pasando de nuevo en el en el método aquí porque se cambió. Por lo que recolector de fechas. Esa no. No, no, no. Sin fecha picker fecha punto. Y así en este punto, lo que vamos a hacer es en realidad vincular ese valor de cadena al campo de texto de fecha de vencimiento. Por lo tanto, fecha de vencimiento campo de texto obtuvo texto igual a fecha formateada. Y lo que haremos es después de que lo hayamos vinculado al campo de texto descartará las vistas de entrada . Hará vista consiguió fin. La edición se establece en true, al igual que lo hicimos para seleccionar una tarea. Ahora, vamos a ejecutar esto en el simulador encendido, ver cómo se ve. Muy bien, Así que entra en el, uh, campo de texto de fecha de vencimiento aquí, y sigamos adelante y escojamos fecha diferente. Voy a probar el 18 de junio y mira eso. Por lo que mira tus seis para el mes 18 para la fecha o el día y luego 2018 para el año. Vamos a tratar de recoger algo más lo intentará. A lo mejor el 18 de septiembre. Quizá volemos el año 2020. A lo mejor reventar la fecha. Pocos días. 22. Parece que todo está funcionando ahí. Si regresas y pruebas el otro campo aquí, um, eso también funciona como se esperaba. Uh, asegúrate de que mis teclados simulados trabajen aquí, teclado de software y, um, viaje. Y bastante seguro, todo está funcionando bien. 16. Mejorar la experiencia de el usuario: ahora, antes de que estemos listos para crear la tarea, hay un par de cosas que queremos mejorar. Te das cuenta de inmediato que se titulan Botón cerrado están realmente cerca de la barra de estado aquí, hasta el punto en que se ve visualmente poco atractivo. Entonces eso es algo que definitivamente queremos abordar. Y además de eso, uh, ¿qué pasa si un usuario abre accidentalmente un, um, picker ver un teclado o un selector de fecha, pero no quiere hacer una selección desde ahí y no tiene forma de descartar el real ? No hay botón de cierre. No hay forma de salir de ello sin hacer realmente una selección en la imagen real de ti. Y eso es algo en lo que también queremos mejorar. Entonces, empecemos con la barra de navegación y veamos qué podemos hacer ahí. Por lo que el espacio predeterminado eran generalmente las alturas de las barras de estado 2020 píxeles. Entonces lo que haríamos es tomar nuestra barra de navegación que tenemos en este momento y bajarla por 20 píxeles ahí. Entonces si volvemos al tablero principal de cuentos aquí, podemos empezar a trabajar en eso ahora mismo. Y si entramos en el controlador de vista creador de tareas y bajamos aquí a los problemas de diseño automático de resultados , podemos seleccionarme restricciones claras mientras tenemos la barra de navegación seleccionada para que solo elimine las restricciones para el barra de navegación. Y una vez que hemos hecho eso, fueron libres de empezar a mover la barra de navegación alrededor. Y lo que voy a hacer aquí es entrar en este pequeño icono de regla arriba para el inspector de tallas, y voy a empezar a moverme. El eje Y es a medida que aumenta el eje y, en realidad se moverá hacia abajo el control o el elemento que haya manipulado. Por lo que queremos bajar eso por 20. Y una vez que tenemos eso ahí a ah, como eran 20. Pero podemos hacer es seguir adelante y agregar algunas restricciones de nuevo para arreglarlo en esta posición en la forma más fácil de hacerlo sería entrar en el botón totalmente fuera aquí, y vamos a añadir una restricción superior, una restricción derecha o final, una restricción izquierda o líder y ah, vamos a hacer una altura de 44 ahí y ah, vamos a poner eso fijo en posición Así que ahora vamos a ejecutar esto en el simulador y ver cómo se ve como es así. Definitivamente se ve mejor, pero en realidad podemos mejorar en esto y llevarlo un paso más allá. En realidad podemos replicar la barra de navegación exacta que un controlador de navegación utiliza por defecto dentro de nuestro controlador de vista de modelo que no presenta dentro de la pila de navegación . Y para ello, necesitamos usar realmente el delegado de la barra de navegación son una barra de navegación y usar uno de los métodos de delegado para lograr ese look. Entonces lo que es Debilitar Dio abre aquí el asistente de editor. Entonces tenemos nuestro guión gráfico abierto y nuestro código por un lado. Y si vamos a nuestro controlador de vista creador de tareas, lo que haremos es seleccionar la barra de navegación y crear un outlet Navy para ello. Así que mantenga presionada la tecla de control, haga clic y arrastre sobre el controlador de vista, y sólo llamaremos a esta barra de navegación puede crear la conexión. Y entonces lo que haremos aquí es ya que en realidad vamos a usar al delegado asignándolo , y si lo hizo, lead hará barra de navegación de punto Delegado, que es una U. N. Navegación delegado de bar es igual a sí mismo. Ahora notarás que aquí vamos a obtener un error de compilación bastante rápido porque test creator view controller no se ajusta a este protocolo todavía porque acabamos de agregarlo. Entonces exactamente de la misma manera que lo hemos hecho para la vista de selector y el delegado de campo de texto. Lo vamos a hacer por el delegado de la barra de navegación. Entonces lo haremos creando una extensión. Estás encargado Creator View controller, que se ajusta a ti, yo delegado de barra de navegación y el método que queremos usar desde aquí. Si empiezas a escribir la palabra posición cuatro barra que devuelve la, um, posición de barra, vamos a volver arriba adjunto. Ahora, volvamos a correr eso en el simulador y a ver si eso hizo algún tipo de mejora hacia cómo se posicionó nuestra barra de navegación. Por lo que usted concede que la barra de navegación aquí ahora está unida a la parte superior muy similar a como son los controladores de navegación. Barra de navegación es eso. Parece que sigue en el mismo estilo, pesar de que es un motivo. Presentamos el controlador de vista, por lo que tipo de funciona, y se ve mucho mejor que lo que teníamos antes de ahora por descartar cualquiera de los tipos de teclado que se presentan. Sería genial si tuviéramos una forma de detectar si User hubiera tocado fuera del teclado. Y de hecho, hay una manera de hacerlo. Y podemos usar lo que se llama un gesto U I tap. Reconocer er er para detectar un toque en un particular tienes elementos en este caso, quisiéramos poner ese toque en la vista de controladores de vista para determinar cuándo fue tocado y luego descartar cualquier cosa que pudiera estar abierta. Entonces lo que podemos hacer aquí es crear un nuevo método. Um, funk privado configure, tap gesto, Reconocer er y podemos llamar a eso a la vista. ¿ Se cargó justo después de llamar a configurar campos de texto. Así que configura gesto de tap Reconocer er y creará un nuevo, uh, gesto. Reconocedla así. Entonces deja que algún gesto de tap reconozca er igual a que te toque gesto. Reconocer er er y el inicializar usará Aquí está el objetivo y la acción, igual que lo hicimos antes Para el selector de fechas U I. Vamos a hacer lo mismo otra vez, programáticamente uh, agregando básicamente un manejador de tap. Click Candler Así que el objetivo en este caso será auto para el creador de tareas real de tu controlador Y el selector va a ser el método que se invoca cuando se selecciona el tap . Ahora, en este caso, aún no he escrito ese método, Pero empezaré escribiendo selector. Y será el controlador de vista creador de tareas, um dot detectó? Sí, y luego aquí mismo, toda función creativa. Uh, ábrelo donde tengamos el otro. Funk sí detectó tap y vamos a ver si llegamos ahora probablemente va a quejarse. Aquí, déjame ver si Ah, aún no. Tenemos que exponer en o b j C. Porque dije que este método en realidad se puede usar en el objetivo C la forma en que se está inicializando en Swift. Al menos déjame verificar que eso está ahí. Entonces OK, sí detectó aplicación está ahí. Y, um, si quisiéramos pasar en el gesto, reconocer? Er, um cuando de una manera podríamos hacer eso es, um, reconocer er así. Y luego si bajamos aquí, sigamos adelante y asegurémonos de que construya y lo haga. Entonces eso es una cosa que puedes hacer si pasas ese parámetro. Básicamente estás pasando, uh, uh, el control con el que se interactuó en este caso, los reconoce. Entonces si necesitamos unas propiedades particulares en el reconocer o podríamos pasarlo así o podríamos simplemente haber salido es una función vacía. Realmente no importaba en el caso de la fecha seleccionada cuando necesitábamos el selector de fechas para Thea obtenga la hora o la fecha que fue seleccionada. Eso eso es solo 11 forma de hacer eso. Eso no terminamos aquí. Todavía tenemos que añadirlo en realidad. Entonces ver, que es la vista Controladores de ustedes no agregan gesto Reconocer er el gesto de tap reconocer er mismo. Entonces ahora estamos escuchando grifos y en la detección real de un tap que vamos a hacer aquí se llama vista Got end editing dijo que True, Vamos a seguir adelante y probar eso en el simulador y ver cómo se juega. Muy bien, así que dentro del crear nuevo controlador de tareas, Vamos a ver aquí para que podamos sacar nuestra imagen de ustedes. Y si toco fuera de los gestos de tap detectados y descartamos el teclado llamando a edición final y probémoslo en la fecha de vencimiento. Debilita los negocios a partir de ahí. Probémoslo en el teclado para el título. Cuando lo descartes desde ahí, intentemos escribir algo aquí, descartando. Todavía podemos hacer nuestras selecciones regulares porque normalmente lo haríamos. Atrapando una fecha, Tal vez la cerramos de nuevo, pero no queríamos abrirla, y no queremos hacer una selección. Por lo que acabamos de salir rápido y eso cubre todos nuestros casos de uso aquí. Entonces en este punto, nuestras experiencias de usuario que mejoraron mucho, y estamos listos para crear la tarea y pasar eso de nuevo al controlador de vista de tabla para hacer lista y agregado a la lista. 17. Crear la tarea de Nite: Entonces ahora también estamos y listos para crear realmente la tarea. Um, Entonces lo que queremos hacer aquí es bajar al método create task tapped aquí, y aquí es donde vamos a tomar toda la entrada que el usuario ha generado y crear la tarea sobre despedido este controlador de vista automáticamente. Entonces para empezar, queremos hacer un par de cheques de cordura. Queremos asegurarnos de que podamos obtener todos los atributos y no tenemos ningún problema. Por lo que lo primero que queremos comprobar es conseguir el título de tarea que el usuario puso para que podamos hacer un cheque por título de tarea. Haremos un let título tarea igual a tarea, su título texto texto texto texto punto texto y lo podemos hacer aquí es guardia. Deja que vuelva ehlz, y acabaremos de poner impresión falló al obtener los atributos requeridos. Entonces si seguimos adelante y si la recordamos para crear una nueva tarea, tenemos que dar un título, una fecha de vencimiento y un tipo de tarea real. Entonces, además de todo eso, lo que también podemos hacer es que necesitamos revisar esos otros dos atributos que necesitamos ahora, además solo del título de tarea que necesitamos comprobar la fecha de vencimiento y el tipo de tarea. Pero también sólo buscar nuevas no es suficiente. Ah, usuario también podría dejar de agregar en cualquier texto, a pesar de que el atributo de texto podría no ser nulo, Puede que no haya caracteres en el campo de texto, por lo que necesitamos ampliar nuestro cheque para considerar también ese escenario. Y lo podemos hacer con bastante facilidad ampliando nuestra declaración de Guardia con un título de tarea que cuenta mayor que cero, que básicamente dice que tiene que haber caracteres en este campo de texto de título aquí antes de considerarlo Ballad on. Y si no estás familiarizado con la declaración de la Guardia, es básicamente como si algo no iguala chequeo nulo, sin embargo es se puede usar de manera más explícita porque guard significa mucho heno. Algo podría salir mal aquí, presta atención y usemos un programa o sepamos que hay algunos casos que debes comprobar . Y sabes que este caso aquí mismo es básicamente equivalente a si, ya sabes, campo de texto de título fuera texto no es igual nulo y tarea titulada ese recuento es mayor que cero , excepto en un guardia Vamos a estilo sintaxis para que podamos ampliar en esto para los otros campos exactamente de la misma manera. Y si tuviéramos una coma aquí antes que lo demás, también podemos hacer esto. Um, deja tipo de tarea. El texto es igual al tipo de tarea, texto, campo, texto y tipo de tarea. El conteo de textos es mayor que cero en nuestro caso final para esta comprobación se va a dejar la fecha de vencimiento . Texto es igual a fecha de vencimiento, texto de punto de campo de texto y cuenta de texto de fecha de vencimiento creada en cero. Y eso nos cubrirá para que nos aseguremos de tener texto válido para todos nuestros campos en lugar de simplemente imprimir si algo sale mal. ¿ No sería bueno si llegáramos a ver algún tipo de estandarte de época o una alerta? Es bastante fácil hacerlo. Y lo podemos hacer con lo que se llama un controlador U I alert, que muestra básicamente un pequeño mensaje pop up con un título y algo de texto y un botón para que podamos configurar una nueva función para esa cadena de error de pantalla funk privada y de título de error mensaje de error strain, y vamos a crear una nueva instancia de un tú tampoco. Troller. Vamos Ah, error Alert Controller es igual a au controlador de alta alerta. Y para el Isar inicial usará el título de mensaje con estilo. Pasaremos por error, mensaje de la era del título y por el título de estilo. O sea, usaremos la alerta. También hay una hoja de acciones, pero eso no es relevante para este tipo de mensaje de error. Para que eso nos consigamos configurados para el título y el mensaje. Pero también necesitamos agregar en el botón ok donde el botón para descartar la vista de alerta o el controlador de alertas. Por lo que podemos hacer eso creando una acción u yo alerto. Entonces vamos, um bien, acción te iguala. Alertas acción para el Isar inicial para el estilo de título y Handler, y para el texto iba a poner bien para el estilo. Voy a poner, um, default. Y para el manejador, esto es justo, ah, el cierre de la devolución de llamada para cuando se hace clic en el botón. Si necesitas hacer alguna lógica, aunque sea opcional, realidad la voy a implementar solo para que veas cómo se ve. Entonces, Príncipe, se llamó al manejador de botones ok. Y una vez que lo hayamos creado, sólo tenemos que agregar eso al controlador de alertas. Pensé acción publicitaria. ¿ Agregas el bien, acción. Y por último, necesitamos presentar el controlador de alerta. De la misma manera habríamos modelo view controller. Por lo que solo llamamos presente error Alert Controller Animado True. Manipulador de terminación, Nil. Realmente no nos importa lo que pase y sigamos adelante y ejecutemos esto, pero vamos a ejecutarlo con Bad in. Pero vamos a probar el, uh el baño no feliz. Por lo que queremos que cualquiera o todos nuestros campos estén vacíos para que podamos ver cómo se está llamando a nuestro control de alertas . Entonces voy aquí, solo llamo, crea tarea sin nada en ella. Ya puedes ver me sale el mensaje también a Si miras hacia abajo en los registros, puedes ver que se llamó al manejador de bien. Entonces eso significa que esto está recibiendo una llamada de vuelta. Uh, civil. Entonces, por ejemplo, si escribo aquí y solo eso creo hit, está bien, veremos que este punto de freno se golpea porque el cierre ah handler se está alcanzando justo aquí. Entonces, um, para que sepamos que eso funciona. Um, y ahora estamos bien para seguir adelante, en realidad construyendo nuestra tarea Así que ahora tenemos el título, el tipo y el texto de fecha de vencimiento. Ahora necesitamos construir el tipo y la fecha a partir de estos por lo que tenemos que hacer a continuación. Está empezando con la fecha creará una, um let date para la materia Igual hizo antes de la materia Y vamos, um, es fecha de vencimiento igual a fecha para la fecha de inicio de la materia de cadena, que la cadena será texto de fecha de vencimiento y te nota este devoluciones y opcional aquí. Entonces también vamos a necesitar hacer un cheque por eso para que podamos hacerlo, guardia, guardia, dejar que tio sea igual a ese otro retorno. Pero antes de que regresemos, también podemos mostrar otro error. Y este podría ser un escenario donde el usuario cambió el texto en el campo de texto, uh, a otra cosa. Y ya no es una validación. Entonces ponemos, um, um, Fecha inválida. Hubo un problema con la fecha y ah, última comprobación tendrá que hacer es para la tarea. Por lo tanto, asegurémonos de que nuestra tarea let sea igual a tarea. Lo siento. tipo de tarea es igual al tipo de tarea a partir del valor bruto de la fuerza, y esa cadena va a ser el texto del tipo de tarea , y también devuelve un opcional, Así que también estamos necesito comprobar que nos turno, y solo haremos el misma cosa aquí. Mostrar otro error si tuvimos un problema en la tarea Balad. De acuerdo, hay un problema con el tipo ask, y si todo eso tiene éxito, entonces estamos bien para ir. Entonces permítanme tarea igual a tarea para el título de prueba aquí arriba, la fecha de vencimiento desde aquí y el tipo de tarea desde aquí. Y en ese punto, podemos llamar despido, lo que nos llevará de vuelta al, um para hacer list table view controller. Por lo que llamaremos animada Verdadera finalización para no antes de ejecutar eso. También asegurémonos de que estamos comprobando el formato de fecha que fijamos desde abajo. Entonces si recuerdas aquí atrás para el mes, mes, día, día año, queremos usar ese mismo formato. Por lo que solo copiaremos esto y en nuestro cheque aquí, asegúrate de que el formato sea el mismo. Ah, y ahora vamos a seguir adelante y correr esto y jugar alrededor y ver si podemos crear una nueva tarea y verificar que en casos válidos se están protegiendo contra En este momento, digamos que um, lavar el auto. Digamos que es trabajo de casa y digamos que tengo que hacerlo para mañana. Pero digamos que cambio, uh, uh, trabajo de casa por un tipo de tarea que no existe, como el trabajo de autos. Y luego me pegué. Crear tarea. Verá que surgió ese tipo de tarea no válido porque había un problema con el tipo de tarea. No pude No pudieron construir un caso para esto porque no es uno de nuestros tipos soportados , um, en la enumeración. Entonces si volvemos a poner eso al trabajo de casa, hazlo Ahora digamos que rompemos la fecha. Um, al poner en una fecha inválida en descartar crear, hubo un problema con la fecha. Está bien, genial. Entonces eso parece estar atrapando eso. Y digamos que tenemos todo lo demás, pero por alguna razón, acabamos de decidir que Teoh omite el título por completo. Crea tarea, faltando atributos requeridos. Entonces estamos bastante bien protegidos aquí en las cosas de hace. Un poco extraño. Y ahora, uh, por fin lava el auto, que ahora este es nuestro caso válido. Vamos a seguir adelante y crearlo. Y bastante seguro, creamos la nueva tarea y descartamos el controlador de vista Ahora tenemos un problema. ¿ Cómo llegamos a la nueva tarea desde donde estaba en el creador de tareas de tu controlador, volver al controlador de vista de tabla para hacer lista y lo más importante, tenerlo agregado automáticamente a la vista de tabla. Eso es algo que todavía no podemos hacer en este momento. Y entonces eso es algo que vamos a resolver implementando nuestro propio protocolo. Ese va a ser nuestro delegado, y nuestro delegado va a ser notificado para cuando se creó una nueva tarea y poder agregar esa nueva tarea a nuestro controlador de vista de tabla automáticamente. 18. Introducción a los protocolos y la delegación: Entonces en nuestro último video, nos enfrentamos al dilema de cómo realmente pasamos la nueva tarea de nuevo a nuestra tabla de lista para hacer de usted controlador. Y si bien hay un par de maneras de hacer esto y no necesariamente una respuesta roja en particular , este es un punto realmente bueno para empezar a hablar de partículas y el patrón de diseño de delegación . Entonces comencemos por puede ser crear un ejemplo rápido en un patio de recreo. Simplemente podemos ilustrar el punto de forma aislada y luego tomar ese concepto y aplicarlo a nuestra app. En mi zona de juegos rápida aquí, creé una clase muy básica on, y esta es una clase recién llamada pet con una propiedad, un nombre, un Isar inicial que asigna ese nombre. Y esta mascota podría ser cualquier cosa. Podría ser un perro. Un pájaro podría ser un gato. Podría ser algo más exótico, tal vez hasta una serpiente. Entonces un protocolo es básicamente un blueprint, un blueprint de funcionalidad. Entonces si quisiéramos definir un perro para conductas que pertenecerían al perro, podríamos crear un protocolo llamado Perro. Podríamos decir que este protocolo tiene un parque de funciones Y tal vez esta partícula tenga una raza particular para el perro. Entonces tal vez una barra, uh, raza de tipo cuerda. Y a un nivel muy básico, esto significa que cualquier clase que se ajuste al protocolo del perro debe tener una raza, y debe tener la capacidad de ladrar. Entonces digamos, por ejemplo, hacemos que mascota se ajuste al perro para que podamos hacerlo de la siguiente manera. Podríamos hacerlo. El este estilo de sintaxis aquí. Y cuando hagamos que mascota se ajuste al perro, verás que estamos consiguiendo una era de inmediato que no se ajusta a este perro protocolo . Y si hace clic en el mensaje de error, se pregunta si queremos agregar stubs de protocolo. Y si golpeamos, arregla lo que va a pasar. ¿ Se van a agregar automáticamente los códigos X en raza para una propiedad y una función llamada Bark? Y está haciendo eso porque sabe que esto es lo que definimos en el protocolo aquí mismo . Y así tenemos que tener este comportamiento porque el protocolo exige que nos dio para que pudiéramos hacer algo así como imprimir. Por ejemplo, um nombre ladró en voz alta. También podemos inyectar en una raza aquí por el tipo de aquello que pertenece con ese perro para que pudiéramos hacer auto punto raza igual raza, y que tipo de garantiza una forma de asegurarse de que esta clase se vaya dedo del pie tienen ciertas cosas que especificamos aquí. Entonces si agregamos en el parámetro faltante para la raza y digamos Fluffy es un pug ahora cuando puedo hacer aquí es en lugar de eso puedo decir pet, no trabajes en su lugar y veremos que Loving ladró en voz alta y esponjosa. Se trata de una lectura o un pug que parte en voz alta para que el problema un poco más sentido en contexto aquí. Y así que esa es una forma en que podemos hacer que una clase se ajuste a un protocolo las otras formas a través extensiones. Entonces hemos estado haciendo esto prácticamente todo el tiempo. Um, como viste con el delegado de vista de tabla U I y fuente de datos, el tú yo picker ver delegado en fuente de datos. Estábamos implementando todos esos a través de extensiones. Entonces ahora que tipo de entendemos los protocolos, cambiemos de marchas y hablemos del polvo de diseño de delegación. Entonces en los términos más simples, delegación es básicamente un patrón donde un objetor, una cosa puede delegar responsabilidades a otra entidad, clase o cosa que actuará en su nombre. Ahora se ilustra mejor a través de un ejemplo, y creo que tendrá bastante sentido una vez que te muestro esta pieza de código aquí. Entonces supongamos, por ejemplo, que tenemos una clase llamada dueño de mascotas o bebé. Llamemos al dueño de un perro, ¿eh? Ahora es do dueño de mascotas y vamos a crear otro político llamado perro Delegado. Y digamos que este protocolo tiene una función. Perro sí ladró. Y así nuestro dueño de mascota tiene una mascota. Y digamos que nuestro het real aquí y en este caso sólo asumirá que es Ah , perro, um, tiene un delegado. Por lo que vamos a hacer var delegado de tipo perro delegado como opcional apenas de empezar. Y no te preocupes si esto es un poco confuso, todo tiene sentido una vez que está todo unido. Entonces nuestro dueño de mascota, digamos que tiene un nombre, que es la cadena tipo. Digamos que tiene una mascota y lo inicializaremos con un nombre y mascota real. Por el momento, tan bueno. Um y así lo que podemos hacer aquí es en realidad en Stanciute nuestro dueño. Entonces hagámoslo aquí. Eso diremos. Dejar cortar dueño es igual al dueño de la mascota. Su nombre será Jim. Y esa será la mascota que acabamos de crear arriba, que es nuestro pug. Y vamos a cambiar el nombre de nuestra mascota. Teoh. Sólo nombre. Es un bicho. Y así, Hasta ahora tan bueno. Entonces tenemos eso configurado aquí. Ahora, recuerdan Ponemos aquí esta propiedad delegada, y lo que podemos decir es que nuestro dueño de mascota se va a conformar con delegado de perros, lo que significa que el dueño de la mascota es el delegado o actúa en nombre de su mascota, mientras que el Doc en esta instancia. Entonces lo que podemos hacer es crear otra extensión podemos crear extensión. Y esta es exactamente la forma en que lo hemos estado haciendo por ti. Escojo de ustedes delegado en fuente de datos, delegado de vista de tabla en fuente de datos. Por lo que extensión sobre dueño de mascota, que se ajusta a delegado de perro. Y ahora, si dejamos sentarnos aquí, vamos a conseguir un error de compilación diciendo que Hey, no nos conformamos con el protocolo. Tenemos que implementar el método perro hizo Mark. Entonces empezamos a escribir perro no ladró. Ahora nuestro delegado es el dueño de la mascota. Puede reaccionar y hacer algo al respecto. A lo mejor le han notificado eso. Oye, necesito alimentar a mi perro en cualquier momento, el perro ladra. Entonces, ¿cómo invocamos eso? Y para mí aquí, bueno, necesitamos en realidad una señal los delegados. Entonces si nuestro dueño de mascota se ajusta al protocolo y lo que podemos decir, pet dot delegado es igual a uno mismo. Y la razón por la que podemos decir yo es porque el yo se refiere porque está dentro del dueño de la mascota . Con clase se refiere al dueño de la mascota. Y debido a que esta extensión de dueño de mascota se ajusta al delegado de perro, esa es la razón por la que podemos asignarla a sí mismo. Lo que significa que una vez que hemos establecido esta propiedad aquí, estamos enchufados a la cadena de delegados. Estamos escuchando cualquier notificación o cualquier evento que sea perro podría pasar a emitir. Ahora, para invocar esto, tenemos que realmente desde la clase de salud o el protocolo del perro. Tenemos que seguir adelante e informar a nuestro delegado que, en este caso, nuestro delegado es dueño de mascotas. Eso pasó algo. Entonces en este caso, cuando ladrar se llama después de una declaración de príncipe, podemos decir delegado dot hizo que su perro no ladró y sucederá aquí es después de que hayamos ido adelante y establecimos nuestras relaciones aquí. Si decimos ladrido de punto de pug, veamos los troncos de la consola aquí abajo. Entonces vemos aquí Fluffy es un pug que ladró en voz alta, que es esta declaración impresa. Me despidieron y luego se notificó al delegado. Cuando ese delegado notificó a quién dueño de mascota viene aquí abajo en ese comunicado es ejecutado. Necesito alimentar a mi perro. Por lo que ahora el dueño de la mascota está consciente de que algo pasó y el dueño es hacer algo respecto. Y podemos usar este concepto para exactamente la misma situación para nuestra nueva tarea e informando a nuestro para hacer controlador de vista de tabla que no existe tu tarea y necesitamos hacer algo al respecto por lo que nuevamente para resumir que la razón por la que usamos protocolos para delegados es porque son el plano que definió el comportamiento en este caso, perro no ladró debe ser implementado por cualquier delegado que se ajuste al protocolo de delegado canino . Ahora, para nuestra app son nuestra lista de cosas que hacer. El controlador de vista de tabla se va a convertir en el delegado para el controlador de vista creador de tareas . Por lo que en cualquier momento que creemos una nueva tarea, nuestro creador de tareas va a informar a cualquier delegado que tiene que ha creado una tarea. Y nuestros delegados en este caso sólo serán la lista de los que hacer. Se va a notificar al controlador de vista de tabla que se creó una nueva tarea. Podemos pasar esa nueva tarea como parámetro dentro del método y luego agregarla a la vista de tabla mientras hacemos el despido de nuestra lista de cosas que hacer real. Nuestra tarea. Creador de ti controlador. Entonces ahora, tomando lo que hemos aprendido aquí sobre verticales y delegados, sigamos adelante e implementemos nuestro propio delegado y en realidad enganchemos eso para que podamos sumar la nueva tarea a nuestra mesa de ustedes. 19. Crear nuestro propio delegado: ahora, tomando lo aprendido del tutorial anterior, podemos hacer delegada nuestra propia tarea Creador. Así que ve a la parte superior de la tarea Creator view controller de nuevo en el proyecto principal en el que estábamos trabajando. Vamos a crear un nuevo protocolo justo por encima de nuestra clase. Ese protocolo se va a llamar tarea Creador, delegado. Y por ahora, sólo vamos a agregar un método. Funk sí creó nueva tarea y proporcionará la nueva tarea como uno de los parámetros a la firma del método. Y sólo llamaremos a esta tarea aquí. Entonces eso es todo lo que van a tener las partículas? Es realmente simple. Un método. No mucho. Teoh. Sí, conforme a. Así que ahora, vuelta en la tarea Creador view controller, Necesitamos crear cualquier propiedad, la propiedad delegada. Entonces vamos a hacer un delegado var de tipo task creator, delegado, y vas a querer hacer esto opcional por la razón de ser es porque tu controlador de vista creador de tareas podría no tener un delegado. Otra clase puede no haberse asignado a ser el delegado para este controlador de vista. Por lo que no queremos tratar de invocar a un delegado que no exista. Entonces al hacerlo opcional si lo invocamos y nadie está suscrito a este delegado, no vamos a conseguir un bloqueo en tiempo de ejecución. Entonces ahora necesitamos averiguar dónde hacemos realmente esta llamada delegada o cuándo notificamos a quien esté escuchando del otro lado que se ha creado una nueva tarea? Bueno, el lugar lógico para hacer eso sería dentro del método de creación de tarea tapped aquí. Una vez que realmente hemos bajado a la nueva creación de tareas. Entonces aquí mismo antes de que hagamos nuestro despido, simplemente podemos hacer esto. El stock delegado sí creó nueva tarea y pasó la nueva tarea así como así. Y de nuevo, bien esto es opcional aquí, si nadie se ha asignado a ser el delegado, entonces eso está bien. Esto sólo pasará por la derecha. No nos estrellaremos en nuestro trabajo de manzana como se esperaba. Entonces ahora volvamos a la lista para hacer el controlador de vista de tabla y asegurarnos de que se convierta en el delegado para el creador de tareas. Entonces en nuestra lista de cosas que hacer aquí, um, probablemente queremos dio es deshacernos de esta fuente de datos estática que lo definimos aquí porque recuerden que estábamos uso de recubrimiento duro, uh, por el momento. Pero vamos a hacer que estos sean dinámicos ahora creando los nuestros propios para que podamos seguir adelante y comentar el constructo una fuente de datos por ahora, o eliminarlo lo que sea que elijas hacer. Si haces comando hacia delante slash podrías resaltar un bloque aquí y comentarlo en una Go. También quiero comentar a la vista. Si cargamos donde lo llamamos, y una vez que hayamos hecho eso, tenemos que hacer aquí es hacer este tipo esto para hacer lista vista de tabla, clase de controlador se ajusten a ese protocolo. Y así, igual que hicimos en el tutorial anterior, podemos crear una extensión en un controlador de vista de tabla para hacer lista. Eso se ajusta al creador de tareas, delegado. Y quizá quieras hacer un comando sea construir tu proyecto aquí porque a veces México tiene problemas para encontrar eso, y una vez que lo encuentre, vamos a implementar ese. No que creamos llamado sí creó nueva tarea. Y así una vez creada esa nueva tarea, nos van a notificar aquí mismo al respecto, y luego podemos hacer algo con ella, que en nuestro caso aquí está agregando esto a nuestra fuente de datos en y luego recargando nuestra tabla vista. Um, pero aún no hemos terminado. No hemos hecho la asignación, básicamente asignando para hacer este controlador de vista de tabla para convertirse en el delegado. Ahora, si recuerdas cómo llegamos al creador de pruebas, si volvemos al tablero principal de la historia cuando en realidad tocamos el botón más Ah, en el controlador de vista de tabla que automáticamente segue pesaba sobre la tarea crear nueva . Entonces aquí mismo, cuando presionamos esto nos Segway aquí a aquí. Ahora, la buena noticia está dentro de nuestra lista de cosas que hacer. Controlador de vista de tabla están preparados para Segway. Método se va a notificar, justo cuando eso está a punto de suceder y se puede ver exactamente de la misma manera que tratamos de averiguar el destino Segways para averiguar qué controlas o vamos Teoh, Podemos usar ese mismo enfoque aquí y averiguar si vamos al creador de tareas y si estamos adelante y asignamos a los propios delegados justo antes de que termine este método. Y eso es exactamente lo que vamos a dio. Entonces prepárense para Segway. Tenemos que estar atentos de dónde ponemos esta pieza de código. Porque si miramos a estos guardias, vamos a estar muchos regresando aquí si ciertas cosas no ocurren. Entonces, por ejemplo, si estamos tratando de esperar una celda u I tabla vista, por ejemplo, si quisiéramos ir al detalle de ustedes pero no lo conseguimos, entonces regresamos. Lo mismo si no pudiéramos obtener una ruta de índice o un controlador de vista detallada. Entonces realmente no queremos poner nuestro código aquí abajo porque va a fallar si en realidad no vamos . Teoh el controlador de vista de detalle. Um, entonces si lo ponemos arriba en la parte superior, aquí está nuestro primer cheque. Entonces lo que podemos decir es, si dejar que el creador de tareas view controller es igual al destino Segway, que es que tienes tu controlador, podemos lanzar eso como un controlador de vista creador de tareas. Entonces si eso si eso si deja chequear tiene éxito, entonces podemos decir simplemente, el creador de tareas view controller, pensé que delegado es igual a self y self siendo el to do list table you controller porque nos hemos conformado a eso protocolo aquí mismo y luego lo que pasará en este caso es que va seguir bajando por esta guardia, Dejemos revisar y luego regresar porque no es una mesa de que vendas. Entonces no vamos a tener ningún problema ahí. No logramos realmente hacer la asignación, y entonces podemos hacer. Aquí es cuando se notifica esto. Por lo tanto debilita declaración de huella aquí. Imprimir una nueva tarea detectada. Podemos añadirlo a nuestra fuente de datos. Entonces si recuerdas, aquí están las fuentes de datos, una matriz de tareas, y simplemente lo levantamos. Nosotros lo recubrimos duro en el inicio de este tutorial, pero ahora podemos levantarlo justo desde aquí. Entonces fuente de datos que anexan tarea. Y si llamamos a una vista de tabla recargar datos después de que levantamos, se va a recargar automáticamente cada fila. Entonces sigamos adelante y probemos eso en simulador y veamos cómo se ve. Nuestro en nuestro vacío para hacer lista tabla vista controlador. Hemos quitado el material duro codificado ahí dentro. Entonces si vamos al icono más aquí para crear una nueva tarea, solo llamaremos a esto, um, tutorial de codificación, y parece que mis teclados simulados no aparecen. Entonces lo que puedo hacer aquí es ir al hardware mientras tengo el simulador seleccionado en un teclado y Tuggle el teclado de software. Y una vez que lleguemos al tipo de tarea, iba a terminar selecto codificación y diré que la fecha de vencimiento es mañana y un gnomo y seguir adelante y crear esa tarea y mira eso. Entonces si miras aquí abajo en el registro, se llamó a la nueva tarea detectada y levantamos esa tarea, lo que significa que esto se volvió a llamar y volvemos a cargar los datos para la tabla de ustedes. Y hagamos una más e incluso tiraré un punto de descanso aquí para que puedas verlo paso a paso. Entonces digamos que queremos entrar en una segunda tarea. Entonces, um, digamos sólo Ah, limpieza o documento ya que tenemos un tipo de tarea de trabajo en casa. Entonces el trabajo de casa y diremos que eso se va a hacer el 22 de merch que crea y mira. Entonces boom, nuestro delegado, que se hizo para hacer lista tabla view controlador se notifica de inmediato. Ha pasado la nueva tarea. Nosotros lo dependemos. Recarga los datos y Walla Ahora Tenemos dos tareas. Y si quisiéramos entrar en el detalle de ustedes para uno de ellos son viejos. El código sigue funcionando exactamente de la misma manera que podemos. Podemos aprovechar cada uno de ellos. No obstante, aún no hemos implementado esto, por lo que no va a mostrar nada. Um, pero todo sigue funcionando. Y así ahora, um, ahora que tenemos eso funcionando dinámicamente, el siguiente paso en este tutorial será implementar el controlador de vista detallada para cuando agreguemos una tarea, luego hacemos una selección sobre ese tarea. Queremos mostrar eso aquí y bonita la interfaz de usuario porque está bastante vacía por el momento. 20. Estilizar el regulador de vista de ojos de detalles: Ahora todo lo que queda es darle estilo al controlador de vista de detalles y hacer que se vea bonito y mostrar los datos que estamos pasando de la tabla de lista para hacer si controlas, que es la tarea seleccionada. Entonces si volvemos a nuestro controlador de vista detallada aquí, verás que todo lo que tenemos es la tarea que pasamos. Y luego imprimimos dentro de ti sí cargó. Entonces vamos a tener que volver a nuestro guión gráfico y empezar a configurar algunos elementos U adicionales para configurar. Si volvemos al guión gráfico y miramos aquí nuestro controlador de vista detallada, es bastante estéril. Entonces sigamos adelante y comencemos a agregar aquí algunos elementos de interfaz. Pero podemos hacer es bajar a la biblioteca de objetos en la parte inferior, derecha, y podemos agregar algunas etiquetas para empezar. Entonces te buscamos. Yo etiqueto podemos arrastrar uno sobre el controlador de vista aquí, y vamos a tratar de aumentar el dentro de la altura y darle a esto una buena posición. Podemos como empezar desde el centro del controlador de vista, luego trabajar como necesitamos y lo que podemos hacer aquí es centrar el texto y, uh, uh, vamos a darle a esto un poco más de espacio puede ser arrastrado hasta los bordes. Simplemente dale máximo espacio y estas pequeñas líneas punteadas azules. O dispones lineamientos que te digan las áreas seguras donde puedes posicionar tus elementos y sigamos adelante y empecemos con este para el título. Lo que haremos aquí es abrir el asistente de editor. Sí. Es decir, solo arrastra esto hacia arriba, el hombre abrirá el controlador de vista diesel de un lado aquí. Y entonces lo que haremos es empezar a crear algunas conexiones. Por lo que nos conectaremos sobre la etiqueta, y ésta servirá como nuestras etiquetas de título. Por lo que a esto se le llama etiqueta de título de tarea. Tú lo conectas y sigamos adelante y creamos unos cuantos más. Entonces yo soy lo que voy a hacer aquí es copiar esta etiqueta. Si haces comando, ve para copia o simplemente selecciona la etiqueta en do edit copy, puedes lograr el mismo resultado, y comando V el no es Victor. Podríamos pegarlo. Ahí hay dos más. Uno para el tipo y otro para la fecha de vencimiento. Y así Sigamos aquí y tratemos de alinearlos. Entonces vamos a subir un poco estos. Y podemos seleccionar todas las etiquetas a la vez con sólo mantener presionada la tecla Mayús, haciendo clic cada una a la vez para una selección múltiple. Y podemos arrastrar estos hacia arriba y tratar de conseguir algún tipo de en el centro así. Ahora notarás aquí que estoy viendo esto como un iPhone ocho. Ahora tenemos que tener cuidado aquí porque nuestro título podría ser largo. Podría ser grande, Um, y tenemos que asegurarnos de que esto se vea bien en un tamaño de pantalla de dispositivo más pequeño. Entonces, antes de que realmente enganchemos cualquier restricción, vamos a establecer algunas fuentes para estas etiquetas. Empezaremos con el título y lo seleccionaremos. Acuden al inspector de Atributos aquí del lado derecho, y cambiaremos la fuente por algo diferente. Voy a dio en avenida o divertido, así que estoy pensando que Avenir siguiente cambiará el estilo demasiado audaz, y hagamos una especie de más grande. Por lo que destaca. Uh, creo que 32 probablemente es lo suficientemente grande y para el otro al tipo en las fechas de vencimiento. Seguiremos adelante y pondremos esos, um Teoh Avenir siguiente, pero un diferente no vamos a usar negrita vamos a usar. Creo que el medio probablemente se verá bien y vamos a seguir adelante y subir eso. Creo que Teoh 26 se ve bastante bien. Haremos lo mismo para la fecha de vencimiento, que es la tercera etiqueta aquí. Entonces la avenida siguiente tamaño mediano 26 y hagámoslo aquí. De acuerdo, así que eso se ve bastante bien hasta ahora. Y así ahora que tenemos eso, intentemos y en realidad sumar las restricciones de diseño automático para arreglarlas en las posiciones apropiadas . Entonces si empezamos con nuestro sello de título y seguimos adelante y lo seleccionamos, si bajamos aquí, podemos ver que está a 146 de los top 16 en adelante desde el lado izquierdo y 16 desde el lado derecho y 37 hacia abajo. Entonces digamos que queremos mantener un cierto espaciado entre las etiquetas debajo de él. Obviamente, podríamos usar una vista de pila como usamos antes en el controlador de vista de creador de entrada, pero otra Otra cosa que podemos hacer aquí es una especie de movimiento alrededor de nuestras etiquetas acercándonos un poco el uno del otro. Y entonces podemos mirar como hacemos cambios verticales que lo que era 37 se ha convertido ahora en ocho píxeles o estar u ocho píxeles de distancia de donde está la etiqueta del título. Entonces si quiero mover estos un poco más hacia abajo, digamos, uh 123456789 10 y mantener un espacio de 18 de distancia. Eso lo puedo hacer aquí y también a Si selecciono mi etiqueta de tipo de tarea, veo que también tiene sus ocho píxeles de distancia de la fecha de vencimiento. Entonces si quiero mantener ese espaciado igual, puedo seguir adelante y seleccionar la fecha de vencimiento. Aumenta más el eje y, lo que lo empuja hacia abajo. Podría hacer eso por un valor de 10 y luego puedo volver atrás y comprobar el tipo podría ver eso. Está bien, es a los 17 así que necesito subir esto uno más, y podría mantener ese espaciado ahí de 18 entre todos ellos. Entonces una vez que hayamos hecho eso, lo que podemos hacer es volver a seleccionar cada uno de ellos, y podemos arrastrarlos todos juntos y realmente buscar ese centro. En la guía de diseño te mostrará dónde se ISS en este punto. Lo que podemos hacer entonces es con todos ellos seleccionados, podemos tener múltiples restricciones al mismo tiempo. Así que digamos que queremos agregar una restricción inicial y la final para que 16 de distancia de cada directriz de diseño, Vamos adelante y digamos Queremos fijar la altura en 55 para cada uno de estos. Vamos a añadir esto para ver qué pasa. Entonces casi estamos teniendo un problema aquí porque todavía hay algo de información. diseño automático necesita entender dónde posicionar estos. Y si miramos las medidas de aire reales que estamos recibiendo, necesitamos una restricción para la posición Y. Entonces lo que básicamente queremos hacer es tratar de decir, Hey, auto layout. Queremos un médico, cada una de estas etiquetas, exactamente donde están en su eje Y justo aquí en este controlador de vista en particular. Entonces si seguimos adelante y los seleccionamos todos al mismo tiempo, y luego bajamos aquí al botón por una línea, lo que podemos hacer aquí es checar verticalmente en contenedor, pero no sigas adelante y pegues por el momento. Ya verás aquí que el valor actual está establecido en cero Ahora, si está establecido en cero, lo que pasará es que va a posicionar verticalmente todo en el centro muerto porque ese va a ser el eje cero aquí para esta vista. Controlador encendido. No queremos hacer eso porque ¿qué pasará si lo hago? No queremos eso. Eso es indeseable. Entonces iba a golpear Command Z o simplemente editar, um, deshacer Y te voy a mostrar lo que necesitamos agregar para ello s Así que realmente queremos Dio es hacer lo que hicimos otra vez, pero bueno aquí. Revise verticalmente. Pero ve a este desplegable y usa el valor actual del lienzo. Con ese dicho es, toma la posición blanca para cada uno de estos que yo etiqueta y eso va a ser donde está posicionado verticalmente, después había sumado las tres restricciones y se puede ver que se quedan donde están Ahora todos nuestras advertencias desaparecen porque están posicionadas correctamente. Ahora aquí está el día importante. Entonces ahora mismo seguimos haciendo esto es un iPhone ocho. Digamos que bajamos al tamaño de dispositivo más pequeño, que es el iPhone four s, y luego trabajemos. Mira nuestro título y vamos al inspector actual aquí y sumamos uno de nuestros títulos más largos . Y si recuerdas el título predeterminado para uno, teníamos planeando un viaje a España. Ahora, mira, eso es un problema. Um, nuestro texto se está recortando porque el pensamiento es demasiado grande para el con del dispositivo. Ahora, si volvemos a un iPhone ocho, no es un problema. Tenemos suficientes bienes raíces de pantalla para manejar eso ahora. Por suerte, hay una solución fácil para eso, y lo que podemos hacer aquí es que si tienes la etiqueta seleccionada Weaken, ve debajo del auto retráctil justo aquí y ve cómo establece un tamaño de fuente fijo. Podemos cambiar eso a una escala de pensamiento mínima o a un tamaño de fuente mínimo, así que voy a seleccionar un tamaño mínimo de fuente y verás aquí que está establecido en un valor predeterminado de 16 y de repente nuestra etiqueta ahora encaja dentro de un iPhone por s. Ahora bien, si volvemos a subir a un plus. Se remonta al tamaño de fuente más alto a 32. Y si está bien ahora, digamos que subimos a un iPad y solo echamos un vistazo ahí y se podía ver que seguimos usando el tamaño máximo que definimos como 32. Y estamos centro muerto en el verticalmente en la pantalla donde lo queríamos. Por lo que incluso podríamos subir un poco más ese divertido tamaño. A lo mejor, Ah, 35. Y vamos a saltar de nuevo al iPhone para S y se puede ver que todavía está escalando el pensamiento apropiadamente para el tamaño del dispositivo, lo cual es genial. Por lo que ahora estamos listos para conectar las dos últimas etiquetas para el tipo de tarea en la fecha de vencimiento y antes de comerciar los puntos de venta. Una cosa que necesitamos para asegurarnos de que hacemos es volver a nuestra tarea aquí. Y si recuerdas, inicialmente teníamos todos estos arrancar este privado privado para que ninguna otra clase pudiera acceder a ellos. Eso no necesitaba acceso a estos inmuebles. Bueno, ahora necesitamos acceso a ellos porque los estamos vinculando a la interfaz. Entonces tenemos que hacer es cambiar la fecha de vencimiento de privada a interna, por lo que solo podemos eliminar privada e interna es el modificador de acceso predeterminado, y ahora podremos acceder a ella para hacer ese enlace. Entonces una vez que hayas hecho eso, volvamos al controlador de vista detallada aquí y empecemos a crear nuestros puntos de venta para las otras dos etiquetas. Entonces voy Teoh, adelante y solo controla. Haga clic sobre y va a ser la etiqueta del tipo de tarea, y también voy a parecer que puede haber eliminado esa conexión. Déjame volver a poner esto al título de prueba aquí y luego también hacer por la fecha de vencimiento. Y ahora tenemos todas estas conexiones en su lugar. Vamos a seguir adelante y crear una nueva función, funk privada configure interfaz, y lo que podemos hacer aquí es en lugar de esto, si dejar tarea es igual a tarea, solo vamos a seguir adelante y recortar eso. Por el momento. Vamos a llamar a configurar interfaz de usuario a la vista. ¿ Se carga dentro del método va a pegar eso si se deja Jack aquí, y la razón por la que estamos haciendo ese Jack es porque la tarea es opcional. Queremos asegurarnos de que realmente tenemos una tarea antes de empezar a hacer cualquier tipo de operaciones que potencialmente podrían ser vinculantes, sin valores y causando un bloqueo de tipo de ejecución. Entonces ahora que hemos, ah, ah, ya sabes, rastreado y desenvuelto con éxito nuestra tarea, sigamos adelante y en realidad empecemos a engancharla. Por lo que empezando por el título, podríamos hacer nivel de título de tarea. El texto obtenido es igual al título del punto de tarea. De igual manera, podemos hacer la etiqueta de tipo de tarea que el texto de la gente es el punto de tipo de punto de tarea para todo valor traído valor porque es un e newme. Ese es un tipo de cadena en los valores equivocados, la representación de cadena de esa enumeración. Y por último, para la etiqueta de fecha de vencimiento de tarea. Vamos a usar una fecha para la materia porque si recuerdas punto de tarea tendré que golpear comando para estar aquí porque necesitamos compilar en ese cambio que hicimos para que la fecha sea interna. Entonces ahora si hago punto de tarea puedes ver que aparece la fecha de vencimiento y es una fecha de tipo, así que no es un valor de cadena, así que tenemos que convertirlo para que hagamos una fecha para la materia. Dejar fecha para materia es igual a una fecha para materia, y estableceremos ese formato de fecha un formato al mismo formato que usamos desde el Creador de tareas de entrada y poner pocos controlador. Por lo que eso fue una mayúscula M m minúscula D D y minúscula. ¿ Por qué? ¿ Por qué, Por qué, por qué? Y luego finalmente, lo que podemos hacer aquí es la tarea. Etiqueta de fecha de vencimiento, no texto es igual a la fecha para la cadena de materia desde la fecha. El día que pasará es la fecha de vencimiento del punto de tarea. Ahora, antes de ejecutar todo, arreglemos una última cosa. El aviso aquí de que el controlador de vista de detalle y el guión gráfico tiene un botón de retroceso azul, y realmente no encaja con el tema de nuestro tipo de estilo negro sobre amarillo. Ahora bien, si recuerdas, uh, si recuerdas, esta barra de navegación viene del controlador de navegación porque está heredada porque está incrustada en esa jerarquía. Entonces una solución rápida para esto es que en realidad podemos establecer una carpa global en la barra de navegación para que realidad sea de un color diferente. Entonces si vas y seleccionas tu controlador de navegación y entras aquí y seleccionas la barra de navegación que podemos hacer es entrar al inspector de atributos de la barra, baja bajo palabra, dice vista aquí. Busca tienda intención de establecer a este azul aquí mismo es un valor por defecto, pero podemos cambiar eso a un color diferente. Podemos cambiarlo a negro, por ejemplo. Y cuando sigamos adelante y ejecutemos esto, va a ser un botón de retroceso negro. También antes de que lo ejecutemos. Probemos una cosa más en el controlador de vista de detalle. Hay una propiedad llamada Título y si lees aquí, es un s local durante que representa a la vista que administra este controlador. Si establecemos esto, solo demos detalle de tarea. Bueno, en realidad, viendo la barra de navegación, el título real aparece aquí en el centro para que podamos dar esto Ah, poco más de, ah, información en cuanto a qué pantalla estamos en. Y queremos hacer un cambio final. Vuelve a la lista para hacer el controlador de vista de tabla y solo para que podamos probar esto rápidamente , vamos a seguir adelante y un comentario, deconstruir método de fuente de datos solo para volver a poner las tareas estáticas que habíamos creado. Y ahora sigamos adelante y ejecutemos esta posada un iPhone SG, que es un tamaño de pantalla más pequeño solo para verificar que todo se vea y actúe como esperábamos . Teoh. Entonces sigamos adelante y pinchemos en uno de los más largos como planear Trip to Span y puedes ver aquí mismo que están atrás Botón es negro. El título tarea de detalle está apareciendo aquí en el centro de nuestra barra de navegación, y pudimos ver nuestro viaje de planificación de texto a España. Se ve bien. No se recorta. Vayamos a éste otra vez. Se ve bastante bien. Y ahora intentemos realmente crear uno. Así que solo llama a esto, uh, nueva tarea y yo iba a hacer que mi teclado esté alterado aquí. Pondremos eso en el estudio en categoría. No digas que eso se debe en un par de días. Yo no lo creé. Y así aquí está nuestra nueva prueba que se metió en la parte inferior porque teníamos nuestras tareas estáticamente definidas cargadas aquí. Si entramos en esa nueva tarea de prueba estudiando y esa es la fecha de vencimiento que habíamos fijado. Por lo que parece que todo está funcionando como se esperaba, 21. Agregar los detalles de la toques de pulir: ahora en la fase final de nuestro tutorial, queremos que nuestro up se vea un poco mejor, particularmente en nuestro controlador de vista de tabla para hacer lista. Específicamente, queremos hacer tres cosas. Queremos añadir un título a la parte superior de nuestra barra de navegación. Queremos hacer que estas celdas sean un poco más pequeñas verticalmente, y luego cuando no tengamos celdas en nuestra vista de tabla o una lista vacía, queremos tener una vista de fondo que muestre una etiqueta indicando que necesitamos agregar algunos datos a nuestra tabla. Entonces empecemos primero con el fondo de ti en nuestra vista de tabla, y lo que vamos a hacer es crear una etiqueta, pero no vamos a crear una etiqueta en el guión gráfico. Lo vamos a hacer programáticamente. Entonces lo primero que haremos es ir a la tabla de lista para hacer de usted controlador y comentar nuestro método de fuente de datos constructo aquí, y vamos a seguir adelante y echar un vistazo a lo que tenemos en este momento cuando tengamos nuestra fuente de datos comenta hacia fuera, y así solo tenemos una vista blanca. Realmente no tenemos nada aquí que indique que tenemos listas vacías. Simplemente no vemos nada. Presentarse. Entonces ahora sigamos adelante y echemos un vistazo a una propiedad muy interesante en la vista de mesa U I . Entonces lo que voy a hacer aquí son sólo comandos. Haga clic en cualquiera de la tabla de uso U I. Confinado y salto a la definición y dentro de la vista de tabla. Busco una propiedad llamada fondo Byuk, y si leemos la documentación aquí, es una opcional que tienes tú y el fondo se te redimensionará automáticamente para rastrear el tamaño de la vista de tabla. Esto se colocará como una subvista de la vista de tabla detrás de todas las celdas y encabezados y pies de página, y eso es exactamente lo que vamos a usar. Vamos a crear una etiqueta programáticamente, que deriva de ti, yo veo, y vamos a establecer esa etiqueta como la vista de fondo para nuestra vista de tabla. Entonces volvamos al nuevo controlador y empecemos a implementar eso. Ahora Vamos a seguir adelante e implementar una nueva función aquí así que vamos a seguir adelante y crear función llamada pantalla funk privada, mensaje de vista de tabla vacía. En realidad acabo de obtener mostrando la vista de tabla dirá que el parámetro es el mensaje porque eso es un poco más claro en nuestro método de nombrar aquí. Entonces una vez que hayamos hecho esto, vamos a pasar un mensaje. Vamos a crear una etiqueta, y luego vamos a establecer eso en las vistas de tabla, vista de fondo. Por lo que empezar creará una etiqueta como esta. Vamos a vaciar, uh, dejar terminar etiqueta info es igual au etiqueta si te recuerdas, etiqueto es lo que arrastraríamos desde el storyboard a uno de nuestros controladores de vista en interfaz Builder. Entonces, esencialmente todo lo que estamos haciendo es crear uno de estos programáticamente. Y si ven aquí, esta pequeña caja, el rectángulo, las esquinas, esto es lo que se conoce como la caja de límites, también conocida como el rebote, um, o el marco. Y así, esencialmente, eso consiste una etiqueta, o en cualquiera que yo vea como elemento. Se trata de algún tipo de control con una posición de una caja. Se coordina x y dentro de la altura. Y así cuando creamos una etiqueta, si ven aquí, tenemos unos cuantos inicializamos er's tenemos una u I etiqueta simplemente vacía Brett, Y entonces tenemos una con un marco y otra con un codificador. Entonces como no vamos a estar haciendo ningún tipo de archivo de ONU a partir de datos, no vamos a usar el método del codificador. Normalmente, podríamos usar el método de marco. Y cuando decimos dicho un marco, realmente estamos diciendo que quiero poner una X y A Y dentro de la altura. Entonces, por ejemplo, si dijera que quiero que esto esté a 100 X, tal vez 100 por qué y 200 dentro de 50 y altura, Bueno, podría volver de manera equivalente al guión gráfico, y podría echar un vistazo aquí, y en realidad podría poner esos alrededor manipulando la X e Y el dentro de la altura para ver visualmente cómo podría parecer eso. Y yo podría hacer exactamente lo mismo en código usando el asedio erect ti. Etiqueo inicializado con el marco justo aquí, Pero lo bonito es que, ni siquiera necesitamos pasar por figurar fuera de marco porque al igual que la documentación , dijo la vista de fondo de la tabla, automáticamente dimensionarás el que vives o la etiqueta o el control para que quepa dentro de la vista de fondo, por lo que simplemente podemos crear una etiqueta U I así. Ahora vamos a seguir adelante y crear la asignación así que vamos a hacer una tabla de ti punto Vista de fondo es igual al nivel de información y ahí mismo hemos ido adelante y hecho la tarea, pero aún no hemos terminado. Tenemos que seguir adelante y establecer el texto y configurar nuestra etiqueta. Entonces lo que podemos hacer aquí, junto a establecer el texto, pensar que la etiqueta no es texto igual al mensaje. Entonces ahí mismo. Por el momento, tan bueno. Ahora tenemos que poner algunas cosas más. Queremos que el texto sea centrado. No queremos que se deje justificado, una derecha justificada. Entonces lo que podemos hacer aquí es buscar información, etiquetar alineación de texto de punto, y podemos establecer eso igual al centro de puntos. Adicionalmente, queremos establecer el número de líneas a cero porque si tenemos un mensaje realmente largo, queremos no recortar nuestra etiqueta. Um, para una línea, queríamos derramar en múltiples líneas, por lo que al establecerla en cero, permitirá en solo esa situación tantas líneas como los mensajes largos. Ahora sigamos adelante y pongamos el pensamiento Así que podemos hacer aquí está en etiqueta info. Cuenta con una propiedad llamada font eso. Es au I font y podemos crear eso programáticamente Al igual que estableceríamos un constructor de interfaces como este Te encontré usaremos el nombre y tamaño inicial Isar así que estuvimos usando Creo Helvetica nueva y pienso en la etiqueta más grande en esta tabla celdas fue audaz para que pudiéramos probar eso aquí y ver cómo luce eso. Se dirá que puede ser a un tamaño apagado 20. Tan sólo para que tipo de es grande y destaca. Ya sabes, esa garrapata, uh, deletreó eso mal? Se ve bien. Nuestra función aquí se ve bastante bien, pero aún tenemos que averiguar ¿Dónde llamamos a esto? Ahora, aquí hay un par de posibilidades, pero una posibilidad realmente interesante, al menos en este ejemplo, porque sólo tenemos una sección de nuestra vista de tabla está en nuestro número de filas y sección. Um y así una sección puede constituir como, ah agrupación de datos y se puede tener más de uno ahora si tuviéramos más de una sección en nuestra vista de tabla. Podríamos tener diferentes tipos de datos en lugar de solo una matriz de un tipo en particular. Ahora, lo que necesitamos estar atentos es de que siempre tenemos que comprobar. Bueno, ¿ cuándo queremos mostrar esta tabla de ustedes mensaje? Bueno, realmente, queremos mostrarlo en cualquier momento o la vista de tabla está vacía. ¿ Cómo sabemos si nuestra vista de tabla está vacía? Bueno, nuestra fuente de datos probablemente será cero para el conteo, y eso es exactamente lo que podemos hacer. Entonces si entramos en número de filas en la sección aquí y decimos si fuente de datos que cuenta es igual cero o una vista de tabla vacía, entonces adelante y mostrar el mensaje de vista de tabla vacío. Y lo que podemos decir son algunos para hacer tareas. Y luego de lo contrario, suponiendo que la fuente de datos que cuenta es mayor que cero en esta instancia, la vista de fondo de la vista de tabla dijimos que sabemos para que no tenga la etiqueta. Sabrá cómo no tendrá una vista asociada a ella. En realidad renderizará los datos. Entonces en cualquier momento agregamos o eliminamos elementos y básicamente recargamos la fuente de datos. llamará a este método y luego haremos el cheque aquí. Y entonces si no tenemos nada en la vista de tabla, mostraremos nuestro mensaje. Si tenemos cosas, eliminaremos nuestro mensaje de pantalla. Ahora vamos a probar esto y a ver cómo se ve. Entonces así es como se ve y se ve bien. Podemos hacerlo un poco mejor porque ese audaz realmente sí que se destaca. Um y ah, el embarque podría no ser el mejor. Así que volvamos al controlador de vista aquí en lugar de atrevidos por esa diversión. Usemos una luz ligera, uh, tamaño en lugar y en lugar de hacer, vamos a intentarlo, crear algunas tareas. Corremos eso una vez más con esos cambios y veamos si eso se ve un poco mejor desde una perspectiva como tú aux. Y creo que eso se ve mucho, mucho mejor. Entonces tenemos ese set. Estamos bien para irnos. Ah, y ahora sigamos adelante y tratemos de agregar un título a la barra de navegación, y simplemente podemos hacerlo si recuerdas de cómo lo hicimos en detalle. View Controller es entrevistado Cargar. Podríamos seguir adelante y establecer esa propiedad de título en el controlador View a un valor de cadena. En esta instancia, podría tener sentido sólo dio para hacer lista. Simple así. Y ahora sigamos adelante y corremos eso y veamos cómo se ve con la lista de cosas que hacer establecida para el título. Se ve bien y ahora para un cambio final, Lo que vamos a hacer es ir adelante y poco común el método de fuente de datos constructo solo porque debilite rápidamente, echa un vistazo a todo aquí y veamos si podemos hacernos un poco más pequeños para disminuir el espaciado vertical que tenemos entre ellos aquí. Entonces volvamos al guión principal y echemos un vistazo a la subclase celular que tenemos en el controlador de vista de tabla para hacer lista Y cuando sigamos adelante y seleccionemos nuestra celda aquí y echemos un vistazo a la, uh, tamaño real de la misma aquí, así que pusimos eso a una altura de 1 45 Ahora, inicialmente , se ve algo bien, pero a medida que empezamos a desarrollar esto más, parecía que puede ser un poco demasiado alto por lo simple que nuestro estructuras de datos son. Entonces si queremos una disminución que se esconda verticalmente, tendremos que mover un par de cosas. A partir de ahí, podemos llevarnos aquí nuestra etiqueta de subtítulos y subir un poco, solo que siempre tan ligeramente a la derecha hasta la parte inferior de la etiqueta del título. Y recuerda que estas advertencias Ah anaranjadas aquí están diciendo que nuestras restricciones siguen aquí. Pero hemos movido nuestro marco aquí, así que tenemos que seguir adelante y o bien actualizar el marco, que luego lo volvería a poner aquí, lo cual no queremos hacerlo ni actualizar las restricciones para posicionarlo donde está el nuevo fotograma eso ahora mismo. Entonces con la etiqueta seleccionada Weilen, ve aquí a resolver problemas de diseño automático y simplemente tenía actualización, constantes de restricción, y seguiré adelante y me encargaré de eso por nosotros. Ahora, si volvemos a la altura de fila, empecemos a disminuir eso un poco a la vez. Trata de conseguir algo que se vea bien ahora. Parece que nuestras etiquetas se están emborronando un poco ahí. Eso está bien. Bajémoslo a los 120 y luego vamos a seguir adelante y tomar esa etiqueta una vez más, traerla de vuelta abajo, tipo de lavado hasta el borde aquí, y creo que podríamos hacerlo un poco mejor. Sigamos adelante y tomemos esa venta y la llevemos a los 15 y veamos cómo se ve eso. Tomaremos ese algún título, capaz de nuevo destruido y moverlo con el layout. Los lineamientos nos están alineando, Doc, y actualizaremos las restricciones de la misma manera que lo hicimos. Y veamos a qué distancia está esta etiqueta de la etiqueta del título, por lo que la seleccionaremos. Iremos aquí a este botón y recibiremos que fueron exactamente para lejos de la siguiente etiqueta. Entonces eso está bastante cerca. Casi tocándolo. Eso está bien. Entonces eso se verá mejor visualmente que lo que teníamos antes. Recuerda aquí, pesar de que actualizamos esta altura de fila a 1 15 también necesitamos seguir adelante y hacerlo en el controlador de vista porque está devolviendo una altura de fila de 1 45 porque no hemos actualizado eso , y eso lo hará anula este 15 aquí y haz que nuestra mesa de ustedes venda se vea mal desde una perspectiva visual. Entonces si volvemos al controlador de vista de tabla para hacer lista. El cambio final será que se ha convertido este 1 45 en un 15 Ahora sigamos adelante y ejecutemos esto en el simulador y veamos cómo se ve. Eso se ve mucho mejor, mucho menos desperdicio en el espacio. Y vamos a seguir adelante y los comentarios se construyen método fuente de datos aquí y crear una tarea de principio a fin con todos nuestros cambios en aquí y C se completan aplicación. Por lo que las tareas de Grayson terminan el recubrimiento del proyecto y lo dijo para mañana. Sí, Bien, Genial. Mira eso. Se ve bastante bien. Tenemos todo listo como lo queremos, y se ve mucho mejor que lo que teníamos antes.