Share
Este Consejo rápido de iOS te enseñará cómo animar fácilmente objetos con UIKit. Ya sea que necesite menús deslizantes o monos voladores, es fácil hacerlo, y esta sugerencia le mostrará cómo!
La animación en aplicaciones móviles puede ser una característica muy importante. Desde un punto de vista práctico, UX, puede avisar al usuario que algo ha sido cambiado o movido. Desde un punto de vista más entretenido, puede mover sprites de juegos o mapas de mosaicos por la pantalla, llevando al usuario a una experiencia totalmente interactiva..
Afortunadamente, es muy fácil hacer que los objetos UIView se muevan en sus aplicaciones de iOS, y ni siquiera tiene que preocuparse por calcular ecuaciones geométricas crípticas u otros vudú similares.!
Antes de entrar en la animación real, debemos estar familiarizados con las propiedades de animación básicas de los objetos UIView. La siguiente es una lista de todas las propiedades de iOS 5.1:
No tenemos suficiente espacio en esta sugerencia rápida para revisar todas estas propiedades, pero veremos algunas de las más comunes: centro, alfa y transformación..
[UIView animateWithDuration: (NSTimeInterval) animations: ^ (void) animations]
En su forma más básica, lo anterior es todo lo que necesita para animar una vista UIV. Es bastante sencillo: pase una duración (el tiempo que durará la animación) y luego las propiedades que se animarán (los valores que desea que tengan las propiedades de UIView al final de la animación).
Para un ejemplo rápido, si tenemos una UIView llamada "theView", y queremos que desaparezca hasta que sea invisible dentro de una duración de .5 segundos, llamaríamos:
[UIView animateWithDuration: 0.5f animations: ^ [theView setAlpha: 0.0f]; ];
¡Y hemos terminado! La duración de la animación se establece por el animateWithDuration: parámetro, y un bloque Objective-C de acciones de animación específicas se suministra al animaciones: parámetro. Es así de fácil!
A menudo, queremos hacer algo después de que termine la animación. Tomaremos un juego por ejemplo. Digamos que queremos mostrar a un jugador que han completado con éxito una acción. Haremos esto haciendo que una estrella vuele hacia arriba en la esquina izquierda de la pantalla, y luego se agregará un punto a su puntaje. Hay dos cosas que querremos hacer una vez que la estrella termine de volar:
Para hacer esto, llamaremos a nuestro método de animación con un bloque de finalización, como este:
[UIView animateWithDuration: (NSTimeInterval) animaciones: ^ (vacío) finalización de las animaciones: ^ (finalización de BOOL) finalización];
Por ejemplo, si tenemos un UIImageView (es decir, una subclase de UIView) llamado "starImageView", con una imagen de una estrella, y una variable numérica llamada "puntos", llamaríamos:
[UIView animateWithDuration: 0.7f animations: ^ [starView setCenter: CGPointMake (0, 0)]; finalización: ^ (BOOL finalizado) [starView removeFromSuperView]; puntos ++; ];
Vale la pena señalar que tendremos que volver a agregar nuestro "starView" como una subvista de nuestra UIView si queremos ejecutar esta animación nuevamente. Puede ver esto en el código de ejemplo que se adjunta a este tutorial Mobiletuts +.
Finalmente, hay un método que nos permitirá definir aún más detalles sobre nuestro proceso de animación, incluido un retraso antes de que se ejecute la animación, y establecer el tipo de "flexibilización" para nuestra animación. Estos tipos de "relajación" se pueden encontrar (y describir) en el archivo de encabezado UIView.h como enumeraciones:
typedef enum UIViewAnimationCurveEaseInOut, // lento al principio y al final UIViewAnimationCurveEaseIn, // lento al principio UIViewAnimationCurveEaseOut, // lento al final UIViewAnimationCurveLinear UIViewAnimationCurve;
Te animo a que juegues con ellos, colocándolos en el parámetro "opciones" del siguiente método de animación:
[UIView animateWithDuration: (NSTimeInterval) delay: (NSTimeInterval) opciones: (UIViewAnimationOptions) animaciones: ^ (vacío) finalización de animaciones: ^ (finalización de BOOL) finalización];
Y una vez más, utilizando nuestros ejemplos anteriores combinados, retrasaremos nuestra animación en 0,1 segundos, luego comenzaremos a moverla (lentamente al principio, luego acelerando y luego volviendo a ir lentamente al final). Además, mientras movemos nuestra imagen, la atenuaremos a 0% de opacidad. Finalmente, una vez que finalice nuestra animación, agregaremos un punto a nuestra puntuación y eliminaremos la imagen de nuestra vista UIView.
[UIView animateWithDuration: 0.6f retardo: 0.1f opciones: UIViewAnimationCurveEaseInOut animations: ^ [starView setCenter: CGPointMake (0, 0)]; [starView setAlpha: 0.0f]; finalización: ^ (BOOL finalizado) [starView removeFromSuperview]; puntos ++; ];
Como puede ver, es súper fácil animar sus UIViews, así que tómese un tiempo para jugar con las diferentes propiedades animables de UIView, y vea qué nuevas cosas puede descubrir.!
Para práctica adicional, use el siguiente comando para rotar su imagen:
[starView setTransform: CGAffineTransformRotate (starView.transform, 90.0f)];
¡Ahora, vea qué otras cosas son posibles con animaciones para UIViews! Y recuerde, hay varias subclases de UIView que se pueden animar con estos mismos métodos y propiedades, como (pero no limitado a):
La imagen de la estrella utilizada en este tutorial fue lanzada con una licencia GNU / GPL de FindIcons
Accentsconagua