Este documento describe los elementos visuales y reconocedores de gestos en iOS. Explica elementos básicos como botones y etiquetas, así como reconocedores de gestos predefinidos para arrastrar, pellizcar, rotar y más. Detalla cómo configurar y agregar reconocedores de gestos a vistas para reconocer interacciones del usuario.

1. 7 - ELEMENTOS VISUALES
Curso de desarrollo de aplicaciones móviles para iPhone y iPad
endika.gutierrez@urbegi.com
alex.rayon@urbegi.com
Urbegi Learning
Contents

2. CONTENIDO
• Introducción
• Elementos Visuales
• Reconocedores de Gestos

3. CONTENIDO
• Introducción
• Elementos Visuales
• Reconocedores de Gestos

4. INTRODUCCIÓN
• Además de las vistas con las que hemos trabajado iOS provee
de una gran cantidad de elementos visuales
• Desdelos más sencillos como botones, textFields hasta
elementos complejos como WebViews, o MapViews

5. INTRODUCCIÓN 2
• Adicionalmenteexiste otro elemento llamado reconocedor
de gestos o GestureRecognizer para reaccionar ante los
gestos producidos en una vista
• Con esta combinación podemos generar feedbacks tactiles
realmente buenos

6. CONTENIDO
• Introducción
• Elementos Visuales
• Reconocedores de Gestos

7. ELEMENTOS
VISUALES
• Todo elemento visual en iOS recordemos que hereda de la
clase UIView
• La
clase UIControl actua como padre de todos los controles,
por ejemplo botones, sliders, etc.
• Hereda de UIView

8. ELEMENTOS
VISUALES - UIBUTTON
• Elcontrol más sencillo y de los más empleados en el
llamado UIButton
• Setrata de un boton al uso que permite una
configuración muy profunda del mismo
• Podemos asignarle una vista de modo que será la que se
muestre en el boton

9. ELEMENTOS
VISUALES - UIBUTTON
• El constructor por defecto si no se inicializa con
InterfaceBuilder es:
• + (id)buttonWithType:(UIButtonType)buttonType;
• Recibe como parámetro un enum con el tipo:
typedef enum {
UIButtonTypeCustom = 0, // Sin visualización
UIButtonTypeRoundedRect, // Rectangulo blanco redondeado
UIButtonTypeDetailDisclosure,
UIButtonTypeInfoLight,
UIButtonTypeInfoDark,
UIButtonTypeContactAdd,
} UIButtonType;

10. ELEMENTOS
VISUALES - UIBUTTON
• Podremos configurarle una imagen personalizada con:
• [button setImage:[UIImage imageNamed:@"Imagen"] forState:UIControlStateNormal];
•Y el texto con:
•
[button setTitle:@"Título" forState:UIControlStateNormal];

11. ELEMENTOS
VISUALES - UILABEL
• Otro sencillo elemento es el UILabel que representa una
etiqueta
• Permite alterar propiedades con fuente, número de lineas,
etc.

12. ELEMENTOS
VISUALES - UILABEL
• Parte como cualquier UIView de un cuadro:
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 20)];
label.text = @"Texto"; // Cambiamos el texto
label.font = [UIFont fontWithName:@"Helvetica-Bold" size:12.0f]; // Cambiamos
la fuente

13. ELEMENTOS
VISUALES
• Existen
otros muchos elementos para la entrada y salida de
información con un funcionamiento similar a estos
• UISlider
• UISwitch
• UISegmentedControl
• UIProgressView

14. CONTENIDO
• Introducción
• Elementos Visuales
• Reconocedores de Gestos

15. RECONOCEDORES
DE GESTOS
• Los reconocedores de gestos o GestureRecognizers permiten
reconocer de manera sencilla los gestos más típicos de la
interfaz
• Arrastrar, pellizcar, lanzar, etc

16. RECONOCEDORES
DE GESTOS 2
• Todos los reconocedores de gestos heredan de la clase
UIGestureRecognizer.
•A partir de esta clase se especializan para un tipo
concreto de gesto
• Podemos incluso heredar de ella para implementar
nuestro propio reconocedor de gestos

17. RECONOCEDORES
DE GESTOS 3
• Así existen ya predefinidos los siguientes reconocedores de gestos
• UIPanGestureRecognizer Reconoce el gesto de arrastrar
• UITapGestureRecognizer Reconoce el gesto de tap
• UIPinchGestureRecognizer Reconoce el gesto de pellizcar (Zoom)
• UIRotationGestureRecognizer Reconoce el gesto de rotar con dos dedos
• UISwipeGestureRecognizer Reconoce el gesto de lanzar
• UILongPressGestureRecognizer Reconoce el gesto de pulsar y mantener

18. RECONOCEDORES
DE GESTOS 4
• Para
construir un reconocedor de gestor simplemente
necesitaremos un objeto de destino y un selector
UIGestureRecognizer *recognizer = [[UIGestureRecognizer alloc] initWithTarget:self
action:@selector(gestureRecognized:)];
• El selector recibirá como parametro el reconocedor
• Para añadirlo a una vista:
[view addGestureRecognizer:recognizer];

19. RECONOCEDORES
DE GESTOS 5
• Esposible definir también un delegate
UIGestureRecognizerDelegate con los siguientes métodos:
@protocol UIGestureRecognizerDelegate <NSObject>
@optional
// Retorna YES si debe reconocer gestos
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer;
// Retorna YES si debe reconocer gestos a la vez que otro reconocedor (Ej: Pinch +
Rotate)
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer
shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer
*)otherGestureRecognizer;
// Retorna YES si debe reconocer el evento de Touch
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer
shouldReceiveTouch:(UITouch *)touch;
@end

20. RECONOCEDORES
DE GESTOS 5
• Uncampo a tener en cuenta de los reconocedores es state
que es un enum con el estado actual del evento
enum UIGestureRecognizerState {
UIGestureRecognizerStatePossible,
UIGestureRecognizerStateBegan,
UIGestureRecognizerStateChanged,
UIGestureRecognizerStateEnded,
UIGestureRecognizerStateCancelled,
UIGestureRecognizerStateFailed,
UIGestureRecognizerStateRecognized = UIGestureRecognizerStateEnded
};

21. FIN