3

我一直在尝试了解更多关于CAShapeLayer使用路径设置动画的信息。我想到的第一件事是在弹开之前对边缘产生“压缩”网球的效果。

但我没有使用fillPath图层的 ,而是尝试为该图层设置图像。所以我创建了另一个CALayer,分配给它的内容属性一个图像并动画形状层的路径。

但结果是,图像并没有完全包裹在这条路径中,正如我希望的那样,它会随着路径的动画而增长和缩小,而是在路径动画的同时显示和覆盖图像。

我希望能够让这个图像完全被路径包裹起来,并且随着路径的动画化,无论形状如何,图像仍然被包裹在形状层的这个路径中。图像失真在这里不是问题。

我的想法是,例如,有一个我下载的网球图像,将其包裹CAShapeLayer在一个倒置的泪珠状路径中(见图:)在此处输入图像描述并从一个较小的倒置泪珠形状动画到一个较大的上侧-down 泪珠并最终显示一个圆圈(网球图像)。

是否有可能实现这一目标CAShapeLayer?你能在这里给我一个样品吗?提前致谢。

添加代码:

嗨,这是我到目前为止所得到的(感谢@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"];
}

对于上述效果并将 UIImage 包装在路径中,我在编码方面一无所获......

4

1 回答 1

3

CAShapeLayer 非常适合遮罩,但您的需求不仅仅是遮罩。您需要对图像进行变形,这并不简单,并且 CAShapeLayers 可能无法实现。

有一些选择..

第一个(最难的):通过代码分别将您的标记绘制(通过-(void)drawRect:(CGRect)rect)到黑点。然后通过一个简单的 CoreAnimation 动画对变化进行动画处理。

第二个(最简单的):创建一个图像序列并像这样开始动画:

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];
于 2013-06-19T08:11:56.273 回答