Download - App iPhone

Transcript
Page 1: App iPhone

Aplicaciones iPhoneA

Page 2: App iPhone

PARTE 1: EJEMPLO DE APLICACIÓN: helloWorld_001

Inicio

Abrimos Xcode.

En la pantalla que aparece seleccionamos Create a new Xcode Project.

También se puede crear un nuevo proyecto seleccionando New Proyect desde el menú.

En el dialogo que aparece hacemos click sobre Single View Application.

Page 3: App iPhone

Se generan 5 archivos importantes:

ViewController.h

Vamos al archivo ViewController.h, teniendo en la primera línea:

#import <UIKit/UIKit.h>

Con esto podremos utilizar el UIKit Framework.

A continuación nos encontramos con la siguiente línea de código:

@interface ViewController : UIViewController{

@ Transformará el código en una acción.

Indicamos que va a hacer uso de Interfaz Builder, para ello utilizamos IBOutlet, indicando que algo será escrito en UILabel.

IBOutlet UILabel *label;

Incluimos el botón en el código:

-(IBAction) hello : (id)sendr;

A continuación podemos ver el código completo de ViewController.h:

Page 4: App iPhone

ViewController.m

Lo primero es implementar el método hello en ViewController.m:

-(IBAction) hello : (id)sendr{ }

Incluimos las instrucciones que ejecutará el método:

-(IBAction) hello : (id)sendr{Label.text = @”Hello World!”;

}

A continuación podemos ver el código completo de ViewController.m:

Page 5: App iPhone

ViewController.xib

Vamos a ViewController.xib, abriéndose el Interfaz Builder:

Añadimos una Label a nuestra vista.

Añadimos un Round Rect Button a nuestra vista.

Asociamos Label con File´s Owner, seleccionando label en el cuadro que se abre:

Page 6: App iPhone

Asociamos Round Rect Button con File´s Owner, seleccionando hello en el cuadro que se abre:

Page 7: App iPhone

Ejecución

Vamos a Command y seleccionamos Run, con lo que se compilará y se ejecutará el proyecto:

Page 8: App iPhone

PARTE 2: EJEMPLO DE APLICACIÓN: helloWorld_002

Inicio

Abrimos Xcode.

En la pantalla que aparece seleccionamos Create a new Xcode Project.

También se puede crear un nuevo proyecto seleccionando New Proyect desde el menú.

En el dialogo que aparece hacemos click sobre Master-Detail Application.

Page 9: App iPhone

Se generan varios archivos importantes:

MasterViewController.m

Vamos al archivo MasterViewController.m, teniendo pequeñas porciones de código preprogramado.

Compilamos y ejecutamos sin hacer ninguna modificación del código, obteniendo una tabla en la pantalla del simulador.

La pantalla se muestra así debido a UITableViewController.

Page 10: App iPhone

Lo primero que vamos a modificar en la tabla es el número de filas de la misma, para ello vamos a modificar el código dejándolo como se muestra a continuación (Cambiamos el return de 0 a 1):

Incluimos el código necesario para que nos muestre el texto que deseamos:

cell.textLabel.text = @”Hello World!”;

Page 11: App iPhone

A continuación tenemos el código completo de MasterViewController.m:

Page 12: App iPhone

Ejecución

Vamos a Command y seleccionamos Run, con lo que se compilará y se ejecutará el proyecto:

Si seleccionamos el texto vemos que se queda activo.

Page 13: App iPhone

PARTE 3: EJEMPLO DE APLICACIÓN: helloWorld_003

Inicio

Abrimos Xcode.

En la pantalla que aparece seleccionamos Create a new Xcode Project.

También se puede crear un nuevo proyecto seleccionando New Proyect desde el menú.

En el dialogo que aparece hacemos click sobre Master-Detail Application.

Page 14: App iPhone

Se generan varios archivos importantes:

MasterViewController.m

Vamos al archivo MasterViewController.m, teniendo pequeñas porciones de código preprogramado.

Compilamos y ejecutamos sin hacer ninguna modificación del código, obteniendo una tabla en la pantalla del simulador.

Page 15: App iPhone

La pantalla se muestra así debido a UITableViewController.

Lo primero que vamos a modificar en la tabla es el número de filas de la misma, para ello vamos a modificar el código dejándolo como se muestra a continuación (Cambiamos el return de 0 a 1):

Incluimos el código necesario para que nos muestre el texto que deseamos:

cell.textLabel.text = @”Hello World!”;

Vamos a centrar el texto de nuestra aplicación, para ello vamos a utilizar el siguiente código:

[[cell textLabel] setTextAlignment : UITextAlignmentCenter];

Con esto le decimos a la celda con la etiqueta de texto (cell textLabel) que obedezca las instrucciones que se de setTextalignment, que en este caso será centrar el texto (UITextAlignmentCenter).

Vamos a colocar un botón Edit que nos permita eliminar el texto de nuestra aplicación. El código necesario para su creación se mostraba comentado cuando hemos creado este proyecto:

-(void) viewDidLoad{[super viewDidLoad];

}

Page 16: App iPhone

A continuación tenemos el código completo de MasterViewController.m:

Page 17: App iPhone

Ejecución

Compilamos y ejecutamos obteniendo lo siguiente:

Page 18: App iPhone

PARTE 4: EJEMPLO DE APLICACIÓN: helloWorld_004

Inicio

Abrimos Xcode.

En la pantalla que aparece seleccionamos Create a new Xcode Project.

También se puede crear un nuevo proyecto seleccionando New Proyect desde el menú.

En el dialogo que aparece hacemos click sobre Single View Application.

Se generan varios archivos importantes:

Page 19: App iPhone

ViewController.h

Vamos al archivo ViewController.h, añadiendo un Outlet y la acción del botón.

El código completo será el siguiente:

ViewController.m

Implementamos la acción:

-(IBAction) hello : (id)sender{text.label = @”Hello World!”;

}

Page 20: App iPhone

El código completo será el siguiente:

Imagen de fondo

Arrastramos la imagen hasta nuestro proyecto, apareciendo un cuadro en el que tendremos que dejar marcada la opción Copy ítems into your destination group´s folder. Con esto nos aseguramos de que aunque cambie la imagen o sea borrada, se mantenga en nuestra aplicación.

La imagen tendrá que tener una dimensión de 320 x 480 píxeles y sólo podrá ser en formato PNG.

Page 21: App iPhone

ViewController.xib

Para poder poner nuestra imagen de fondo tendremos que incluir un objeto Image View, seleccionando en el menú de la derecha la imagen que queramos poner de fondo.

Añadimos una Label a nuestra vista.

Añadimos un Round Rect Button a nuestra vista.

Page 22: App iPhone

Asociamos Label con File´s Owner, seleccionando label en el cuadro que se abre:

Asociamos Round Rect Button con File´s Owner, seleccionando hello en el cuadro que se abre:

Page 23: App iPhone

Compilamos y ejecutamos la aplicación, obteniendo el siguiente resultado:

Page 24: App iPhone

PARTE 5: EJEMPLO DE APLICACIÓN: helloWorld_005

Inicio

Abrimos Xcode.

En la pantalla que aparece seleccionamos Create a new Xcode Project.

También se puede crear un nuevo proyecto seleccionando New Proyect desde el menú.

En el dialogo que aparece hacemos click sobre Single View Application.

Page 25: App iPhone

Se generan varios archivos importantes:

Page 26: App iPhone

Imágenes

Tenemos que tener 3 imágenes:

- Imagen de fondo: 320 x 480 píxeles.- Imagen que va a aparecer: 300 x 299 píxeles.- Icono: 57 x 57 píxeles.

Para añadir las imágenes arrastramos las mismas a nuestro proyecto.

Para poner el Icono de nuestra aplicación tendremos que ir al archivo helloWorld_005-info.plist, creamos un nuevo elemento (Icon files) y en item0 ponemos el nombre de la imagen que queremos como icono.

Page 27: App iPhone

ViewController.h

Vamos al archivo ViewController.h, añadiendo dos Outlet y la acción del botón.

El código completo será el siguiente:

*label y *uiImageView son punteros, con esto decimos al Interfaz Builder que utilice la imagen y la etiqueta que hay en la dirección de memoria a la que apuntan dichos punteros.

@property declara que nuestro objeto tiene una propiedad con un tipo específico.

@synthesize implementa los métodos declarados en @property.

nonatomic indica que dejamos que Apple se encargue de la gestión, mientras que retain indica que nosotros vamos a gestionar el control de memoria.

Tenemos que añadir la acción del botón:

-(IBAction) buttonPressed : (id) sender;

Page 28: App iPhone

ViewController.m

Lo primero será incluir @synthesize para que se implementen los métodos declarados en @property:

@synthesize label, uiImageView;

A continuación vamos a hacer que al pulsar el botón se muestre la etiqueta:

text.label = @”Hello World Again”;

También tenemos que conseguir que al pulsar el botón se muestre la imagen, para ello vamos a utilizar el método imageNamed, que nos proporcionará un puntero que apuntará a nuestra imagen:

UIImage *imageSource = [UIImage imageNamed : @”imagen.png”];

Con la siguiente línea de código vamos asociar la imagen que hay en la dirección a la que apunta *imageSource con la dirección a la que apunta *uiImageView:

uiImageView.image = imageSource;

El código completo será.

Page 29: App iPhone

ViewController.xib

Lo primero será poner la imagen de fondo. A continuación colocaremos la etiqueta, el botón y la imagen que queramos que aparezca.

La imagen que queremos que aparezca la seleccionaremos en la opción Highlighted del menú de la derecha.

A continuación relacionaremos File´s Owner con los elementos que componen nuestra aplicación:

- Botón File´s Owner (Seleccionando buttonPressed).- File´s Owner Label (Seleccionando label).- File´s Owner ImageView (Seleccionando uiImageView).

Page 30: App iPhone

Ejecución

Compilamos y ejecutamos el proyecto.