Resumen

Continuando con el taller, vamos a agregar nuestros elementos en pantalla.Vamos a buscar un label primero y lo vamos a arrastrar aquí.Lo posicionamos donde creamos conveniente.Yo lo voy a posicionar al centro.Lo genial de este storyboard es que te marca con estas flechitas punteadas dónde está el centro y pues tú tienes que posicionar tus elementos como quieras.Ok, vamos a agregar un poco.Bueno, vamos a subirla a la fuente.Este va a ser nuestro título.Vamos a dejar en 30.Vamos a centrarlo.Va a decir adivina el número.Ahora sí, alargamos esto para que aparezca en toda la pantalla.Y ya tenemos aquí nuestro título.Vamos a arrastrar otro label que va a ser el de los intentos.Otro, el número de intentos, luego las reglas de juego y nuestro botón.Vamos a buscar un botón de este lado y nuestra caja de texto, nuestro text field.Ok, tenemos nuestro text field aquí.Este label lo vamos a cambiar y le vamos a poner intentos.Vamos a arrastrar más para acá.A este label lo vamos a poner en cinco, que parezca centrado.Este label le vamos a decir, adivina el número del cero al nueve.Ok, eso se me pasó mencionar.Vamos a estar generando un número random del cero al nueve para que nosotros podamos adivinarlo de los valores que ingresemos.Y aquí simplemente un botón de validar.Vamos a hacer un poquito más grande este botón.Aquí está.Ok, hasta ahí muy bien.Y se mira muy bien en un iPhone siete.Pero si nosotros nos vamos a un iPhone se, en este caso, si se dan cuenta, aquí sobrepasa el tamaño de mi text field.Y si nos vamos a un iPhone un poco más pequeño, lo sigue sobrepasando.Si nos vamos a un iPhone o en este caso un iPad Pro, nuestra aplicación por este momento no es responsiva, se podría decir, pero por suerte tenemos las restricciones.Podemos decirle a este label que mida tanto de arriba, tanto de la derecha o de la izquierda, tanto de abajo y ahí se va a quedar, ahí se va a posicionar.Entonces, vamos a ver cómo funciona.Ok, esto vamos a alinearlo primero.Vamos a esta opción, Add new alignment constraints.Vamos a agregar una nueva restricción de alineamiento y vamos a ponerla en horizontal.Aquí, si se dan cuenta, la flechita o la línea aparece en medio.Agregamos ese constraint y nos aparece una línea acá, pero aquí nos aparece en rojo.Vamos a ver si podemos dejarlo todo en azul.Vamos a agregarle una restricción en la parte de arriba que mida ocho.En la parte de los lados, bueno, yo le voy a decir que mida y voy a agregarle un aspect ratio.