3

也许有人可以指出我正确的方向。我试过谷歌，但真的不知道如何用可搜索的术语来定义我的问题。

我正在沿 UIBezierPath 为图像设置动画，如下所示：

UIBezierPath *trackPath = [UIBezierPath bezierPath];
[trackPath moveToPoint:P(8, 250)];
[trackPath addCurveToPoint:P(318, 250)
             controlPoint1:P(156, 86)
             controlPoint2:P(166, 412)];
[trackPath addCurveToPoint:P(652, 254)
             controlPoint1:P(488, 86)
             controlPoint2:P(512, 412)];
[trackPath addCurveToPoint:P(992, 254)
             controlPoint1:P(818, 96)
             controlPoint2:P(872, 412)];


CALayer *bee = [CALayer layer];
bee.bounds = CGRectMake(0, 0, 69, 71);
bee.position = P(160, 25);
bee.contents = (id)([UIImage imageNamed:@"bee3.png"].CGImage);
[self.view.layer addSublayer:bee];

我想做的是在图像沿路径移动时为图像本身设置动画。当它的 b 本身像这样时，我可以为图像设置动画：

    NSArray *blueArray = [NSArray array];
    blueArray = [[NSArray alloc] initWithObjects:
                 [UIImage imageNamed:@"blue1.png"],
                 [UIImage imageNamed:@"blue2.png"], nil];

    blueFly.animationImages = blueArray;
    blueFly.animationDuration = 0.20;
    blueFly.animationRepeatCount = -1;
    [blueFly startAnimating];

可以这么说，我怎样才能将两者结合起来？

此外，我知道如何将路径本身绘制到屏幕上，如下所示：

CAShapeLayer *beeline = [CAShapeLayer layer];
beeline.path = trackPath.CGPath;
beeline.strokeColor = [UIColor whiteColor].CGColor;
beeline.fillColor = [UIColor clearColor].CGColor;
beeline.lineWidth = 2.0;
beeline.lineDashPattern = [NSArray arrayWithObjects:[NSNumber numberWithInt:6],   [NSNumber numberWithInt:2], nil];
[self.view.layer addSublayer:beeline];

但是，当图像沿路径动画时，如何仅在图像后面画线？

4

2 回答 2

3

您可以使用 aCAShapeLayer来显示路径。形状层提供两个属性strokeStart，strokeEnd它们的值介于0和之间，1并确定可见路径的比例。通过动画strokeEnd，您可以创建路径是在屏幕上“绘制”的印象。请参阅http://oleb.net/blog/2010/12/animating-drawing-of-cgpath-with-cashapelayer的示例，该示例为绘制线条的笔设置动画。

为了改变蜜蜂的图像，你可以简单地添加一个动画来改变你的蜜蜂层的内容。例如，要在CAShapeLayer上面的项目中更改笔的图像，我们可以在startAnimation方法中添加以下代码。 

CAKeyframeAnimation *imageAnimation = [CAKeyframeAnimation animationWithKeyPath:@"contents"];
imageAnimation.duration = 1.0;
imageAnimation.repeatCount = HUGE_VALF;
imageAnimation.calculationMode = kCAAnimationDiscrete;
imageAnimation.values = [NSArray arrayWithObjects:
  (id)[UIImage imageNamed:@"noun_project_347_1.png"].CGImage,
  (id)[UIImage imageNamed:@"noun_project_347_2.png"].CGImage,
  nil];
[self.penLayer addAnimation:imageAnimation forKey:@"contents"];

This simply adds a key animation to the contents property of the layer that displays the pen. Note that the image "noun_project_347_1.png" is not part of the project so you would have to add an image to see the effect. I have simply horizontally flipped the image that comes with the project. By setting calculationMode to kCAAnimationDiscrete the animation does not interpolate between two images by replaces one by the other.

于 2012-09-04T07:20:56.763 回答
0

只要你能得到你想要动画图像对齐的确切路径，你就可以使用 Core Animation 和 CAKeyframeAnimation 来做到这一点。

请参阅how-to-animate-one-image-over-the-unusual-curve-path-in-my-ipad-application)链接。

于 2012-09-04T05:08:19.770 回答