domingo, 10 de enero de 2016

Crea tu primera aplicación usando SWIFT



Bien, vamos a crear tu primera aplicación para iOS con swift, ¿Como va funcionar ? Sencillo, la
aplicación va a tener un botón y al presionar el botón se va a mostrar una pequeña alerta con el mensaje "Hola Mundo" así que manos a la obra.








Crear un proyecto
Primero necesitamos abrir nuestro Xcode, una vez abierto, Xcode nos va a mostrar un dialogo de bienvenida.
Vamos a seleccionar "Create a new Xcode project" para iniciar un nuevo proyecto:



Xcode nos muestra varias plantillas de proyectos que podemos iniciar. Para nuestra primera aplicación vamos a utilizar "Single View Application" que se encuentra dentro de iOS y presionamos "Next".



Después nos mostrará la siguiente sección, donde configuraremos nuestro proyecto.




Los siguientes campos se llenaron de la siguiente manera.

Product Name: HolaMundo - Este es el nombre de tu aplicación.
Organization Name: Daniel Brena Aquino - Es el nombre de tu organización.
Organization Identifier: com.brena  - Si cuentas con un nombre de domino,lo ingresas al reves.
Bundle identifier: com.brena.HolaMundo - Este es el identificador unico de tu aplicación, es usando al momento de enviarla a revision. Este campo automaticamente Xcode lo genera.
Languaje: Swift - Puedes utilizar entre Objective-C  y Swift.
Devices: iPhone - Selecciona "iPhone" para nuestro proyecto.
Use Core Data: [No seleccionado] - Por el momento no necesitamos Core Data en el proyecto, así que no lo seleccionamos.
Include Unit Tests: [No seleccionado] - Para nuestro proyecto que es muy simple no la necesitamos.
Include UI Test: [No seleccionado] - De igual forma no lo necesitamos para nuestro proyecto.




Damos click en "Next" y Xcode nos preguntará donde deseamos guardar nuestro proyecto y ahi lo  guardan donde gusten. 
(Seleccione el "Source Control" ya que subiré el proyecto a GitHub.





Después veremos nuestro entorno de desarrollo ya listo para empezar a trabajar.



Probar proyecto en blanco.

Por el momento nosotros no tenemos ninguna linea de código en nuestro proyecto, así que no tendremos mas que una aplicación en blanco. Vamos a presionar el botón "Run".


Cuando presionamos el botón "Run", el Xcode va a cargar el simulador del dispositivo seleccionado y a ejecutar nuestra aplicación.


¿Que tenemos? una aplicación en blanco, ya que no hemos diseñado nada en ella, así que implementamos esa parte.

Diseñando interfaces de usuario usando Storyboard.

En nuestro proyecto vamos a abrir nuestro archivo "Main.storyboard" en el cual vamos a diseñar e ir agregando elementos visuales para nuestra aplicación.

Un Storyboard es la representación visual de la apariencia del flujo de  tu aplicación.



Agregando un botón a la vista.

Ahora vamos a agregar un botón a nuestra vista, en la parte inferior encontramos la area de utilería. Aquí podemos escoger algunos de los "UI Controls" que nos proporcione Xcode, solo basta de seleccionar y arrastrar el elemento dentro de la vista.


Para cambiar el texto de nuestro botón, presionamos dos veces sobre el mismo y podremos editar dicho texto.


Genial, ahora vamos a probar de nuevo nuestra aplicación en el simulador.


Bien, funciona, ahora vamos a codificar algo en nuestro ViewController, asi que le vamos agregar una acciona nuestro botón para que muestra una alerta con el mensaje "Hola Mundo".

Conectando la interfaz de usuario con el código.

Vamos a conectar la interfaz con nuestro código así que vamos a separar nuestra interfaz con nuestro código de la siguiente manera.


Para tener esta apariencia de nuestra area de trabajo, vamos a la parte superior derecha y seleccionamos "Assistand Editors on Right".



Ahora en la interfaz vamos a seleccionar nuestro elemento, en este caso nuestro botón y presionamos la tecla "Ctrl" y sin despegar lo arrastramos a nuestro "ViewController".


En "Connection" le pones "Action" y en "Name" escribimos mostrarMensaje.
Automaticamente nos genera la conexión entre la interfaz y el código.


Ahora vamos agregar el siguiente código que es para mostrar la alerta.

let alertController = UIAlertController(title: "Bienvenido a mi primera aplicación",
   message: "Hola Mundo", preferredStyle: UIAlertControllerStyle.Alert)
alertController.addAction(UIAlertAction(title: "OK", style:
   UIAlertActionStyle.Default, handler: nil))
self.presentViewController(alertController, animated: true, completion:
   nil)


Probar aplicación.

Vamos a probar por ultimo nuestra aplicación y quedará todo listo.




Excelente, tenemos nuestra primera aplicación para iOS con Swift.
Espero que les agrade el tutorial, vamos a ir trabajando mas ejemplos y cada vez mas complejos, saludos.





No hay comentarios:

Publicar un comentario