Introducción

1

Lo que aprenderás sobre el desarrollo de interfaces con iOS

2

Instalacion de Xcode desde 0

Introducción a Xcode

3

Primer Proyecto

4

Navigation Area

5

Editor, Util Area y Tool Bar

6

Targets y Target Tabs

Formas de crear vistas

7

Organizacion de Carpetas

8

Storyboards vs Xibs vs Codigo

9

Splash Screen

10

Completando nuestro Splash Screen

UIView Components

11

TabBar Controller y Mejores Prácticas

12

Storyboard Reference

13

Explicación breve de algunos elementos gráficos

14

Crear nuestra primera interfaz gráfica

15

Diferentes componentes y formas de autolayout

16

Agregando el resto de nuestros componentes usando constraints

Agregando Estilo a UIView Components

17

Agregando un icono a nuestra app

18

Custom colors

19

Agregando iconos a nuestros botones

20

Key paths de redondeo y sombra

21

Custom fonts

22

Scroll view controller

Tipos de vistas y manejo

23

OnBoarding View

24

Container ViewController

25

Container ViewController con código

26

ContainerViews

Adaptación de vistas

27

Tablas

28

Diseño de celdas

Completando nuestras vistas

29

Código para las tablas

30

Tamaños dinamicos para las celdas

31

EmptyState usando código

32

Agregar estilos a nuestro navigation view

33

Agregando estilos a nuestro Tab bar

34

Custom Tab bar button

35

Budget view

36

Iniciando el header de animacion

37

Animación de barra superior en las tablas usando constraints

38

Stats

Conclusiones

39

Reto final

40

Conclusiones

Bonus: Lottie

41

Gestión de dependencias

42

Instalación dependencias con Cocoapods

43

Instalación dependencias con Carthage

44

Cocoapods vs Carthage

45

Crear nuestro lottie file

No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Key paths de redondeo y sombra

20/45
Recursos

Para pulir un poco más nuestra interfaz vamos a redondear los botones para dejarlos parecidos a los de nuestro diseño original y vamos a crear también sombras.

Para redondear los bordes: Para hacer esto no tenemos una propiedad como tal, así que debemos ir al Show Identity Inspector y añadimos el keypath layer.cornerRadius con valor numérico.

Para agregar una sombra: Este procedimiento es un poco más complejo ya que las sombras de los layers usan un cgColor y para eso debemos crear una extensión por código.
Para ello creamos ciertos keypaths y el componente en código creando una extensión y habilitando allí el uso de cgColor.

Reto: Pon la sombra al botón de Google.

Aportes 17

Preguntas 4

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

Es normal que salga este error al añadir el key path de borderUIColor?

Failed to set (borderUIColor) user defined inspected property on (UIButton): [<UIButton 0x7fe6e4c10bc0> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key borderUIColor.

Reto

Donde encuentro todos los KeyPath? para saber que puedo modifica y tiene alguna estructura?

Si por alguna razón les pasa como yo que no podian tener sombra y rendondeo al mismo tiempo, fijense que el Style del UIButton en el Storyboard sea Default o Plain 🥲

¡Hola! Súper buena la explicación pero tengo una duda. ¿el ¿BorderUIColor le cambia el color de la sombra? porque yo bajé el proyecto y en el mío y ambas aparecen con sombra negra

Así quedo el mio 😄

Mas sin embargo, sale esto en la consola:

2021-06-26 19:52:19.705908-0700 Platzi Finanzas[2989:292400] Failed to set (borderUIColor) user defined inspected property on (UIButton): [<UIButton 0x7fd36bf10ae0> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key borderUIColor.

2021-06-26 19:52:19.706102-0700 Platzi Finanzas[2989:292400] Failed to set (borderUIColor) user defined inspected property on (UIButton): [<UIButton 0x7fd36bf0d070> setValue:forUndefinedKey:]: this class is not key value coding-compliant for the key borderUIColor.

Excelente tutorial!! Me gustaría consulta una cosa, porque creamos la extension sobre un UIView y no sobre un UIButton que es la clase del botón? Gracias

Excelente! 😄

La sombra se coloca en la parte arriba del boton, y tengo un error el cual comentar federicopalacio :c

Reto

He notado que es independiente del color el resultado de la sombra, es decir, hice una con el verde y cree otro color Todo negro para el botón de google, al escoger el color probe con ambos y me dieron un buen resultado para la sombra del botón de google, no daria lo mismo poner un color negro para todas las sombras ya que al parecer depende del color que lleve el botón? gracias

Hola, una consulta. La sombra se esta colocando sobre el icono de Google y no sobre el botón, alguien me puede ayudar? 🙏🏻

Es tan interesante saber esto, antes recuerdo que tenia que hacer una clase para poder redondear.