Saltar al contenido

Hacer Zoom en nuestras Apps con UIScrollView

14/10/2014
Hacer-Zoom-en-nuestras-Apps-con-UIScrollView-x

Hemos visto algunas cosas de Swift, pero también debemos seguir aprendiendo Objective-C, pues cómo todos sabéis ambos lenguajes se complementan.

Un buen iOS Developer debe manejar con soltura ambos lenguajes si quiere ser un autentico “Ninja iOS”

En esta entrada vamos a aprender a hacer zoom en nuestras Apps con la clase UIScrollView.

No es muy complejo, pero como todo, requiere conocer algunas cosas.

UIScrollView

UIScrollView es la clase que nos va a permitir “jugar” con el zoom.

Se trata de una clase muy potente, que además de este zoom, nos permite hacer scroll en nuestras vistas.

UIWebView, o las mismas vistas de tabla, tienen embebido un scrollView, de forma que en estas clases este control ya nos viene dado.

Crea un proyecto nuevo, selecciona la plantilla Single View Application, selecciona como lenguaje de programación Objective-C.

A continuación dirigete al Storyboard y añadir un objeto de la clase UIScrollView dentro de tu vista.

Conecta esta vista con tu código, de forma que declares una propiedad.

UIScrollViewDelegate

Una vez más, vamos a hacer uso del patrón del delegado para que nuestro UIScrollView funcione.

Por ello debemos ajustar nuestra clase a este protocolo.

En la fichero de cabecera de la clase ViewController escribe el protocolo justo después del nombre de la clase, debes tener algo como esto:

@interface ViewController: UIViewController <UIScrollViewDelegate> ...

Después en el StoryBoard, conecta el objeto de la clase UIScrollView con tu ViewController y conéctalo como delegado.

En el mismo Storyboard, dentro del objeto de la clase UIScrollView añade un objeto de la clase UIImageView y conéctalo con tu código.

Añade la imagen que quieras a tu proyecto, esto se hace arrastrando la misma desde el Finder a tu grupo de carpetas y archivos.

Haz clic sobre el objeto de la clase UIMageView, y en el inspector de atributos selecciona la imagen que has añadido al proyecto, debería verse la imagen en el Storyboard.

 

Hacer-Zoom-en-nuestras-Apps-con-UIScrollView

Sobreescribiendo el método viewDidLoad

 

En el fichero de implementación, es decir en el fichero ViewController.m sobreescribe el método viewDidLoad con lo siguiente:

 

_miScroll.maximumZoomScale = 4.0;
    
_miScroll.minimumZoomScale = 0.75;
    
_miScroll.clipsToBounds = YES;

 

Observa que mi objeto de la clase UIScrollView la he declarado como una propiedad de nombre miScroll.

 

A continuación implementa el siguiente método:

 

-(UIView *) viewForZoomingInScrollView:(UIScrollView *)scrollView{
    
    return _imagencita;
    
}

 

De igual forma, mi objeto de la clase UIMageView lo he conectado declarando una propiedad de nombre imagencita.

 

Hacer-Zoom-en-nuestras-Apps-con-UIScrollView-2

Compila el proyecto

Pues ya está, ya podemos hacer zoom en nuestra imagen.

Para hacer zoom en el simulador, pulsa la tecla “alt” verás que aparecen dos círculos en la pantalla del simulador, ahora haz clic con el ratón y desplaza el mismo, los círculos se cerrarán y abrirán simulando un pellizco con nuestros dedos.

Una nueva funcionalidad para tus aplicaciones, espero que te haya gustado.

Si tienes cualquier duda, déjame un comentario e intento ayudarte.