CAShapeLayer y UIImage

He estado intentando aprender más sobre el uso de CAShapeLayer animándolo usando la ruta. Lo primero que vino a mi mente fue tener el efecto de una pelota de tenis "comprimida" contra el borde antes de rebotar.

Pero en lugar de usar fillPath de la capa, traté de establecer una image en esta capa. Así que creé otra CALayer , asignó a su contenido una image y animó la ruta de la capa de forma.

Pero el resultado es que en lugar de que la image esté completamente envuelta en esta ruta, que, como esperaba, crecería y se networkinguciría a medida que se anima el path, la image se revelará y se cubrirá mientras se esté animando la ruta.

Me gustaría poder tener esta image completamente envuelta por la ruta y como la ruta está siendo animada, independientemente de las forms, la image aún está envuelta dentro de esta ruta en la capa de forma. La distorsión de la image no es un problema aquí.

Lo que tenía en mente es, por ejemplo, tener una image de pelota de tenis que descargué, envolviéndola en CAShapeLayer en un path al revés como una lágrima (ver foto: introduzca la descripción de la imagen aquí ) y animar desde una forma de lágrima invertida más pequeña en una lágrima invertida más grande y finalmente muestra un círculo (una image de pelota de tenis).

¿Es posible lograr esto usando CAShapeLayer ? ¿Podrías darme una muestra aquí? Gracias por adelantado.

Agregar código:

Hola, esto es lo que obtuve hasta ahora (gracias a @lnafziger)

 //Setting up layer - (void)setupLayer { self.caShapeLayer = [CAShapeLayer layer];< self.caLayer = (CALayer*) self.layer; self.caLayer.contents = (id)([UIImage imageNamed:"@yellowTennisBall.png"] CGImage]); self.caLayer.mask = self.caShapeLayer; } //Animate the path of CAShapeLayer - (void)bounce { CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"path"]; animation.duration = 1.7; animation.repeatCount = HUGE_VAL; animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; animation.fromValue = (__bridge id)[self defaultPath]; animation.toValue = (__bridge id)[self compressedPath]; animation.autoreverses = YES; [self.caShapeLayer addAnimation:animation forKey:@"animatePath"]; } 

Para el efecto mencionado y envolver UIImage dentro de la ruta, no he conseguido ningún lugar con la encoding …

CAShapeLayer es bueno para enmascarar, pero sus necesidades son más que simples enmascaramientos. Debería deformar la image lo que no es simple y CAShapeLayers podría no lograrlo.

Hay algunas opciones …

Primero (el duro): Dibujar (vía -(void)drawRect:(CGRect)rect ) su marcador por código respectivamente al punto negro. Y luego anima el cambio a través de una simple animation CoreAnimation.

Segundo (el fácil): crea una secuencia de imágenes y comienza la animation así:

 NSArray * imageArray = [[NSArray alloc] initWithObjects: [UIImage imageNamed:@"1.png"], [UIImage imageNamed:@"2.png"], [UIImage imageNamed:@"3.png"], [UIImage imageNamed:@"4.png"], [UIImage imageNamed:@"5.png"], [UIImage imageNamed:@"6.png"], [UIImage imageNamed:@"7.png"], [UIImage imageNamed:@"8.png"], [UIImage imageNamed:@"9.png"], [UIImage imageNamed:@"10.png"], [UIImage imageNamed:@"11.png"], [UIImage imageNamed:@"12.png"], nil]; UIImageView * theImageViewToAnimate = [[UIImageView alloc] initWithFrame: CGRectMake(100, 125, 150, 130)]; theImageViewToAnimate.animationImages = imageArray; theImageViewToAnimate.animationDuration = 1.1; theImageViewToAnimate.animationRepeatCount=1; [theImageViewToAnimate startAnimating];