Crear y utilizar íconos personalizados

Clase 9 de 27 • Curso de Swift con Storyboards

Tulio Junior Rangel Nuñez

student•

Aquí el cómo quedó:

Y el logo:

Jeniffer Cruz

student•

Excelente Tulio :clap

Michael Junior Araujo Ynoa

student•

Aporte:

Luis Sandoval

student•

Aporte:

App:

Icono:

Vanessa Tatis Castillo

student•

El resultado

Jairo Toro

student•

App:

Icon:

Jorge Grullon

student•

Asi eś como quedo:

Andres Felipe Landazabal Sanmiguel

student•

Aquilino dejo mi resultado.

Gagandeep Dass

student•

Mi App:

Mi Ícono:

Rosa Palacios

student•

Maximiliano Ovando Ramírez

student•

Mi Aporte de la clase

Imagen principal

!Imagen principal

Imagen en horizontal

!Imagen principal

Imagen en del inicio

!Imagen principal

Aporte adicional

Le agregué una pequeña animación de corazón cuando se presiona el botón de "Send love"

!Imagen principal

Utilice el siguiente código, el cual agrega una acción al botón (se tiene que enlazar desde la vista) y un enlace al mismo para obtener la posición. Adjunto el código de la animación (se puede mejorar y optimizar)

        for _ in 1...6{

            let randomtime = Double.random(in: 0.3...0.8)
            
            DispatchQueue.main.asyncAfter(deadline: .now() + randomtime){
                let heartImage = UIImage(systemName: "heart.fill")
                let heartImageView = UIImageView(image: heartImage)
                heartImageView.tintColor = UIColor.red
                
                // Establecer la posición inicial y el tamaño del corazón
                let heartSize = CGFloat(20)
                let x = CGFloat.random(in: self.buttom.frame.minX ... self.buttom.frame.maxX)
                let y = self.buttom.frame.maxY
                heartImageView.frame = CGRect(x: x, y: y, width: heartSize, height: heartSize)
                
                // Agregar el corazón a la vista
                self.view.addSubview(heartImageView)
                
                // Animación del corazón
                UIView.animate(withDuration: 1.5, delay: 0, options: .curveEaseOut, animations: {
                    heartImageView.frame.origin.y = self.buttom.frame.minY - Double.random(in: 10...30)
                }, completion: { _ in
                    heartImageView.removeFromSuperview()
                })
            }
            
        }

Y el ViewController quedaría de este modo.

//
//  ViewController.swift
//  Proyecto platzi
//
//  Created by Maximiliano Ovando Ramírez on 19/05/23.
//

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var buttom: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func send(_ sender: Any) {
        

        for _ in 1...6{

            let randomtime = Double.random(in: 0.3...0.8)
            
            DispatchQueue.main.asyncAfter(deadline: .now() + randomtime){
                let heartImage = UIImage(systemName: "heart.fill")
                let heartImageView = UIImageView(image: heartImage)
                heartImageView.tintColor = UIColor.red
                
                // Establecer la posición inicial y el tamaño del corazón
                let heartSize = CGFloat(20)
                let x = CGFloat.random(in: self.buttom.frame.minX ... self.buttom.frame.maxX)
                let y = self.buttom.frame.maxY
                heartImageView.frame = CGRect(x: x, y: y, width: heartSize, height: heartSize)
                
                // Agregar el corazón a la vista
                self.view.addSubview(heartImageView)
                
                // Animación del corazón
                UIView.animate(withDuration: 1.5, delay: 0, options: .curveEaseOut, animations: {
                    heartImageView.frame.origin.y = self.buttom.frame.minY - Double.random(in: 10...30)
                }, completion: { _ in
                    heartImageView.removeFromSuperview()
                })
            }
            
        }
        
    }
    
}

        for _ in 1...6{

            let randomtime = Double.random(in: 0.3...0.8)
            
            DispatchQueue.main.asyncAfter(deadline: .now() + randomtime){
                let heartImage = UIImage(systemName: "heart.fill")
                let heartImageView = UIImageView(image: heartImage)
                heartImageView.tintColor = UIColor.red
                
                // Establecer la posición inicial y el tamaño del corazón
                let heartSize = CGFloat(20)
                let x = CGFloat.random(in: self.buttom.frame.minX ... self.buttom.frame.maxX)
                let y = self.buttom.frame.maxY
                heartImageView.frame = CGRect(x: x, y: y, width: heartSize, height: heartSize)
                
                // Agregar el corazón a la vista
                self.view.addSubview(heartImageView)
                
                // Animación del corazón
                UIView.animate(withDuration: 1.5, delay: 0, options: .curveEaseOut, animations: {
                    heartImageView.frame.origin.y = self.buttom.frame.minY - Double.random(in: 10...30)
                }, completion: { _ in
                    heartImageView.removeFromSuperview()
                })
            }
            
        }

//
//  ViewController.swift
//  Proyecto platzi
//
//  Created by Maximiliano Ovando Ramírez on 19/05/23.
//

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var buttom: UIButton!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    @IBAction func send(_ sender: Any) {
        

        for _ in 1...6{

            let randomtime = Double.random(in: 0.3...0.8)
            
            DispatchQueue.main.asyncAfter(deadline: .now() + randomtime){
                let heartImage = UIImage(systemName: "heart.fill")
                let heartImageView = UIImageView(image: heartImage)
                heartImageView.tintColor = UIColor.red
                
                // Establecer la posición inicial y el tamaño del corazón
                let heartSize = CGFloat(20)
                let x = CGFloat.random(in: self.buttom.frame.minX ... self.buttom.frame.maxX)
                let y = self.buttom.frame.maxY
                heartImageView.frame = CGRect(x: x, y: y, width: heartSize, height: heartSize)
                
                // Agregar el corazón a la vista
                self.view.addSubview(heartImageView)
                
                // Animación del corazón
                UIView.animate(withDuration: 1.5, delay: 0, options: .curveEaseOut, animations: {
                    heartImageView.frame.origin.y = self.buttom.frame.minY - Double.random(in: 10...30)
                }, completion: { _ in
                    heartImageView.removeFromSuperview()
                })
            }
            
        }
        
    }
    
}

Crear y utilizar íconos personalizados

Primeros pasos en Swift

Bienvenida a los Storyboards de Swift

¿Qué es Swift?

Recursos necesarios para programar en Swift

Instalación de Xcode

Mi primera app en Swift

Configurar un proyecto desde cero en Xcode

Diseño de una aplicación usando componentes del UIKit para Storyboards

Importación de imágenes a los Storyboards

Stackviews y Constraints

Crear y utilizar íconos personalizados

Reto: replica la interfaz de calculadora del iPhone y muéstranos el resultado

Setup

Clonar el proyecto con la UI creada en Figma

Cambiar elementos de forma programática

Modelo Vista Controlador de nuestra app en Swift

Obtener las respuestas del usuario

Revisión de la Poke API y creación del modelo de datos

Consumo de la Poke API

Extender la funcionalidad del controlador

Lógica del juego

Generar números aleatorios

Image manager

Game model del juego

Validación de las respuestas del jugador

Score y reset del juego

Flujo de storyboards

Navegación entre vistas

Resultado final de nuestra app

Ejecución

Ejecución de Aplicaciones iOS en Dispositivos Físicos con Xcode

Despedida

Siguientes pasos en Swift