Curso de desarrollo iOS(principiante)

sbado 4 de febrero de 12

DA 3

UITableView and UITableViewController Editing UITableView UINavigationController Camera UIPopoverController and Modal View Controllers

sbado 4 de febrero de 12

1. UITABLEVIEW AND UITABLEVIEWCONTROLLER

Los Table View, nos permiten representar una lista de elementos en una tabla.

Para representar las tablas usamos UITableView.

Para explicar UITableView vamos a utilizar un ejemplo prctico en el que veremos los puntos ms importantes.

sbado 4 de febrero de 12

1. UITABLEVIEW AND UITABLEVIEWCONTROLLER

Antes de pasar al ejemplo, vamos a repasar algunos conceptos para trabajar con TableView:

-Data source: es el origen de datos de la tabla, de donde vamos a coger los datos para plasmarlos en la tabla. Se suele utilizar un Array como origen de datos. El array puede contener cualquier tipo de objeto, como strings, imgenes...

-Delegate: nos permite implementar lo mtodos de nuestro TableView. Estos mtodos nos permiten saber cuantas filas tiene nuestra tabla, cuando se ha seleccionado una fila y cual ha sido, la fila que se est rellenando en cada momento...

-UITableViewController, es una subclase de UIViewController

sbado 4 de febrero de 12

EJEMPLO PRCTICO 1

Crear un proyecto para iPhone con un UITableView.

Rellenar el UITableView con los meses del ao.

Segn toquemos en uno un otro de los meses se nos mostrar un mensaje de alerta diferente.

sbado 4 de febrero de 12

EJEMPLO PRCTICO 1

Crear el array de los meses y rellenarlo

- (void)viewDidLoad {! meses = [[NSMutableArray alloc] initWithCapacity:12];! [meses addObject:@"Enero"];! [meses addObject:@"Febrero"];! [meses addObject:@"Marzo"];! [meses addObject:@"Abril"];! [meses addObject:@"Mayo"];! [meses addObject:@"Junio"];! [meses addObject:@"Julio"];! [meses addObject:@"Agosto"];! [meses addObject:@"Septiembre"];! [meses addObject:@"Octubre"];! [meses addObject:@"Noviembre"];! [meses addObject:@"Diciembre"]; [super viewDidLoad];}

sbado 4 de febrero de 12

EJEMPLO PRCTICO 1Eventos de UITableView

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { return 1;}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{! return [meses count];}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{! static NSString *CellIdentifier = @"Cell";!! UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];! if (cell == nil) {! ! cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];! }!! cell.text = [meses objectAtIndex:indexPath.row];!! return cell;}

sbado 4 de febrero de 12

EJEMPLO PRCTICO 1

Eventos de UITableView

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {! UIAlertView *alert = [[UIAlertView alloc]! ! ! ! ! ! initWithTitle: @"Titulo"! ! ! ! ! ! message: [meses objectAtIndex:indexPath.row]! ! ! ! ! ! delegate: nil! ! ! ! ! ! cancelButtonTitle:@"OK"! ! ! ! ! ! otherButtonTitles:nil];!! [alert show];! [alert release];}

sbado 4 de febrero de 12

EJEMPLO PRCTICO 1

Si adems queremos que nuestras celdas tengan un fondo distinto, podemos aadir una imagen:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{! static NSString *CellIdentifier = @"Cell";!! UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];! if (cell == nil) {! ! cell = [[[UITableViewCell alloc] initWithFrame:CGRectZero reuseIdentifier:CellIdentifier] autorelease];! }

! UIImageView *imageBack= [[UIImageView alloc] initWithFrame:CGRectMake(0,0,320,102)];! [imageBack setCenter:CGPointMake(imageBack.bounds.size.width/2, imageBack.bounds.size.height/2)];! [cell addSubview:imageBack];! imageBack.image= [UIImage imageNamed:@"cellBack.png"];

! cell.text = [meses objectAtIndex:indexPath.row];!! return cell;}

sbado 4 de febrero de 12

1. ELIMINAR UNA FILA

-(IBAction)deleteRow:(id)sender{ if ([tableView isEditing]){! ! [tableView setEditing:NO animated:YES]; }! else{! ! [tableView setEditing:YES animated:YES]; }! [tableView reloadData];}

- (void)tableView:(UITableView *)aTableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath{ if (editingStyle == UITableViewCellEditingStyleDelete){ [meses removeObjectAtIndex:indexPath.row]; [tableView reloadData]; }}

sbado 4 de febrero de 12

1. ELIMINAR UNA FILA

sbado 4 de febrero de 12

1. AADIR UNA FILA

Para aadir una fila basta con aadirla a nuestro array y actualizar el tableView:

-(IBAction)addRow:(id)sender{ [meses insertObject:@"Tutorial" atIndex:[meses count]]; [tableView reloadData]; }

sbado 4 de febrero de 12

3. CAMERA

En este captulo aprenderemos a mostrar imgenes, tomar fotos o cogerlas del lbum de fotos.

Para mostrar imgenes usaremos un nuevo control: UIImageView.

Para tomar fotos del lbum de fotos o desde la cmara usamos: UIImagePickerController

sbado 4 de febrero de 12

3. CAMERAVamos a explicar este captulo con un ejemplo, al pulsar el botn Get Photo nos aparecer una alerta para elegir si hacemos una foto o la cogemos del lbum:

sbado 4 de febrero de 12

3. CAMERA

Creamos un nuevo proyecto llamado Camera, le aadimos un UIViewController, y en el XIB del UIViewController aadimos el botn y el UIImageView.

Creamos el evento del botn:

- (IBAction)alerta:(id)sender{! ! alert = [[[UIAlertView alloc] initWithTitle:@"Select an option" message:@"Choose a photo from library or take a photo" delegate:self cancelButtonTitle:@"Cancel" otherButtonTitles:nil] autorelease];! ! [alert addButtonWithTitle:@"Choose Photo"];! ! [alert addButtonWithTitle:@"Take Photo"];! ! [alert show];}

sbado 4 de febrero de 12

3. CAMERA

Comprobamos que opcin se ha elegido:

- (void)alertView:(UIAlertView *)alertView didDismissWithButtonIndex:(NSInteger)buttonIndex {! if (buttonIndex == 1) //Elegir de la librera! {! ! [self getPhoto:1]; }! else if (buttonIndex == 2) //Hacer foto! {! ! [self getPhoto:2];! }}

sbado 4 de febrero de 12

3. CAMERADependiendo de la opcin elegida mostramos el picker de coger fotos del lbum o el de la cmara de fotos.

- (void) getPhoto:(int)option{! UIImagePickerController * picker = [[UIImagePickerController alloc] init];! picker.delegate = self;!! if (option == 1) //Elegir de la librera! {! ! picker.sourceType = UIImagePickerControllerSourceTypePhotoLibrary; }! else if (option == 2) //Hacer foto! {! ! picker.sourceType = UIImagePickerControllerSourceTypeCamera;! }! [self presentModalViewController:picker animated:YES];}

sbado 4 de febrero de 12

3. CAMERA

Cargamos en nuestro UIImageView, la imagen seleccionada:

- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {! [picker dismissModalViewControllerAnimated:YES];!! [[picker parentViewController] dismissModalViewControllerAnimated:YES];!! imageView.image = [info objectForKey:@"UIImagePickerControllerOriginalImage"];

}

sbado 4 de febrero de 12

4. UIPOPOVERCONTROLLER AND MODAL VIEW CONTROLLERS

Las vistas modales son vistas que aparecen en nuestro programa en un momento determinado para realizar una determinada accin, como tomar una foto con la cmara, enviar un email, abrir la lista de contactos, seleccionar una cancin...

En el ejemplo anterior, ya vimos dos tipos de vistas modales, una para obtener una imagen del lbum y otra para obtenerla con la cmara de fotos.

Un Popover Controller es una vista modal, que se muestra flotando en nuestro programa, y nos permite realizar acciones como tomar fotos. Este solo est disponible en la familia de los iPad.

sbado 4 de febrero de 12

4. UIPOPOVERCONTROLLER AND MODAL VIEW CONTROLLERS

En este captulo vamos a ver un nuevo Modal View, el usado para enviar emails. Para ello habr que seguir los siguientes pasos:

1. Implementar el protocolo

MFMailComposeViewControllerDelegate

2. Aadir el framework

MessageUI.framework#import #import

3. Sobreescribir mensajes del delegate implementado

4. Crear mensaje lanzador

sbado 4 de febrero de 12

4. UIPOPOVERCONTROLLER AND MODAL VIEW CONTROLLERS

Sobreescribir mensajes del delegate implementado.

En este caso implementamos el mensaje del delegate cuando se produce algn error.

- (void)mailComposeController:(MFMailComposeViewController*)controller didFinishWithResult:(MFMailComposeResult)result error:(NSError*)error {!! [self dismissModalViewControllerAnimated:YES];}

sbado 4 de febrero de 12

4. UIPOPOVERCONTROLLER AND MODAL VIEW CONTROLLERS

Crear mensaje lanzador con este cdigo

Class mailClass = (NSClassFromString(@"MFMailComposeViewController"));! if (mailClass != nil)! {! ! if ([mailClass canSendMail]) {! ! ! MFMailComposeViewController *picker = [[MFMailComposeViewController alloc] init];! ! ! picker.mailComposeDelegate = self;! ! ! picker.navigationBar.barStyle = UIBarStyleBlack;! ! !! ! ! [picker setSubject:@"Ttulo del mensaje"];! ! !! ! ! // Aadir destinatarios por defecto! ! ! NSArray *toRecipients = [NSArray arrayWithObject:@"info@atomicflavor.com"]; ! ! !! ! ! [picker setToRecipients:toRecipients];! ! !! ! ! // Rellenar contenido del mail por defecto! ! ! NSString *emailBody = @"Introduce aqu tu texto...";! ! ! [picker setMessageBody:emailBody isHTML:NO];! ! !! ! ! [self presentModalViewController:picker animated:YES];! ! ! [picker release];! !! ! } ! }

sbado 4 de febrero de 12