objective-c – 以无缝循环动画无限滚动图像

概述目前，我有一个2048×435的云图像，它使用CABasicAnimation滚动1024×435的园景导向UIImageView。云图像应该是滚动的，但是我试图获得一个重复的云图像来连接到当前云图像的背面，因此在云图像之间没有间隙，我有一些麻烦。我一直在努力寻找解决方案大约一天，所以任何帮助将不胜感激。我当前的代码： 开发Xcode 4.2 for iOS 5与ARC非故事板ipad园景方向。 目前，我有一个2048×435的云图像，它使用CABasicAnimation滚动1024×435的园景导向UIImageVIEw。云图像应该是滚动的，但是我试图获得一个重复的云图像来连接到当前云图像的背面，因此在云图像之间没有间隙，我有一些麻烦。我一直在努力寻找解决方案大约一天，所以任何帮助将不胜感激。我当前的代码：

开发Xcode 4.2 for iOS 5与ARC非故事板ipad园景方向。

@H_404_13@-(voID)cloudScroll{ UIImage *cloudsImage = [UIImage imagenamed:@"TitleClouds.png"]; CALayer *cloud = [CALayer layer]; cloud.contents = (ID)cloudsImage.CGImage; cloud.bounds = CGRectMake(0,cloudsImage.size.wIDth,cloudsImage.size.height); cloud.position = CGPointMake(self.vIEw.bounds.size.wIDth / 2,cloudsImage.size.height / 2); [cloudsImageVIEw.layer addSublayer:cloud]; CGPoint startPt = CGPointMake(self.vIEw.bounds.size.wIDth + cloud.bounds.size.wIDth / 2,cloud.position.y); CGPoint endPt = CGPointMake(cloud.bounds.size.wIDth / -2,cloud.position.y); CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.timingFunction = [camediatimingFunction functionWithname:kcamediatimingFunctionlinear]; anim.fromValue = [NSValue valueWithCGPoint:startPt]; anim.tovalue = [NSValue valueWithCGPoint:endPt]; anim.repeatCount = HUGE_VALF; anim.duration = 60.0; [cloud addAnimation:anim forKey:@"position"];}-(voID)vIEwDIDLoad{ [self cloudScroll]; [super vIEwDIDLoad];}解决方法 你说你的图像是2048宽，你的视图是1024宽。我不知道这是否意味着你已经复制了一个1024宽的图像的内容来制作一个2048的图像。

无论如何，这是我的建议。我们需要将云层及其动画存储在实例变量中：

@H_404_13@@implementation VIEwController { CALayer *cloudLayer; CABasicAnimation *cloudLayerAnimation;}

而不是将云层的内容设置为云图像，我们将其背景颜色设置为从图像创建的图案颜色。这样，我们可以将层的边界设置为我们想要的，并且图像将被平铺以填充边界：

@H_404_13@-(voID)cloudScroll { UIImage *cloudsImage = [UIImage imagenamed:@"TitleClouds.png"]; UIcolor *cloudPattern = [UIcolor colorWithPatternImage:cloudsImage]; cloudLayer = [CALayer layer]; cloudLayer.backgroundcolor = cloudPattern.CGcolor;

然而，CALayer的坐标系将原点放在左下方，而不是左上角，Y轴增加。这意味着模式将被颠倒。我们可以通过翻转Y轴来修复它：

@H_404_13@cloudLayer.transform = CAtransform3DMakeScale(1,-1,1);

默认情况下，图层的锚点位于其中心。这意味着设置图层的位置设置其中心的位置。通过设置其左上角的位置来定位图层将变得更加容易。我们可以通过将其锚点移动到左上角来实现：

@H_404_13@cloudLayer.anchorPoint = CGPointMake(0,1);

层的宽度需要是图像的宽度加上包含视图的宽度。这样，当我们滚动图层以使图像的右边缘进入视图时，图像的另一个副本将被绘制在第一个副本的右侧。

@H_404_13@CGSize vIEwSize = self.cloudsImageVIEw.bounds.size; cloudLayer.frame = CGRectMake(0,cloudsImage.size.wIDth + vIEwSize.wIDth,vIEwSize.height);

现在我们已经准备好将图层添加到视图中：

@H_404_13@[self.cloudsImageVIEw.layer addSublayer:cloudLayer];

现在我们来设置动画。请记住，我们更改了图层的锚点，因此我们可以通过设置左上角的位置来控制其位置。我们希望图层的左上角从视图的左上角开始：

@H_404_13@CGPoint startPoint = CGPointZero;

我们希望图层的左上角向左移动图像的宽度：

@H_404_13@CGPoint endPoint = CGPointMake(-cloudsImage.size.wIDth,0);

动画设置的其余部分与您的代码相同。我将持续时间更改为3秒进行测试：

@H_404_13@cloudLayerAnimation = [CABasicAnimation animationWithKeyPath:@"position"]; cloudLayerAnimation.timingFunction = [camediatimingFunction functionWithname:kcamediatimingFunctionlinear]; cloudLayerAnimation.fromValue = [NSValue valueWithCGPoint:startPoint]; cloudLayerAnimation.tovalue = [NSValue valueWithCGPoint:endPoint]; cloudLayerAnimation.repeatCount = HUGE_VALF; cloudLayerAnimation.duration = 3.0;

我们将调用另一种方法来将动画附加到图层：

@H_404_13@[self applyCloudLayerAnimation];}

这是应用动画的方法：

@H_404_13@- (voID)applyCloudLayerAnimation { [cloudLayer addAnimation:cloudLayerAnimation forKey:@"position"];}

当应用程序进入后台(因为用户切换到另一个应用程序)时，系统会从云层删除动画。所以当我们再次进入前景时，我们需要重新安装它。这就是为什么我们有applyCloudLayerAnimation方法。当应用程序进入前台时，我们需要调用该方法。

在vIEwDIDAppear：中，我们可以开始观察告诉我们应用程序进入前台的通知：

@H_404_13@- (voID)vIEwDIDAppear:(BOol)animated { [super vIEwDIDAppear:animated]; [[NSNotificationCenter defaultCenter] addobserver:self selector:@selector(applicationWillEnterForeground:) name:UIApplicationWillEnterForegroundNotification object:nil];}

当我们的视图消失时，或视图控制器被释放时，我们需要停止观察通知：

@H_404_13@- (voID)vIEwWilldisappear:(BOol)animated { [super vIEwWilldisappear:animated]; [[NSNotificationCenter defaultCenter] removeObserver:self name:UIApplicationDIDBecomeActiveNotification object:nil];}- (voID)dealloc { [[NSNotificationCenter defaultCenter] removeObserver:self name:UIApplicationWillEnterForegroundNotification object:nil];}

视图控制器实际收到通知时，需要再次应用动画：

@H_404_13@- (voID)applicationWillEnterForeground:(NSNotification *)note { [self applyCloudLayerAnimation];}

以下是所有的代码，以便于复制和粘贴：

@H_404_13@- (voID)vIEwDIDLoad { [self cloudScroll]; [super vIEwDIDLoad];}-(voID)cloudScroll { UIImage *cloudsImage = [UIImage imagenamed:@"TitleClouds.png"]; UIcolor *cloudPattern = [UIcolor colorWithPatternImage:cloudsImage]; cloudLayer = [CALayer layer]; cloudLayer.backgroundcolor = cloudPattern.CGcolor; cloudLayer.transform = CAtransform3DMakeScale(1,1); cloudLayer.anchorPoint = CGPointMake(0,1); CGSize vIEwSize = self.cloudsImageVIEw.bounds.size; cloudLayer.frame = CGRectMake(0,vIEwSize.height); [self.cloudsImageVIEw.layer addSublayer:cloudLayer]; CGPoint startPoint = CGPointZero; CGPoint endPoint = CGPointMake(-cloudsImage.size.wIDth,0); cloudLayerAnimation = [CABasicAnimation animationWithKeyPath:@"position"]; cloudLayerAnimation.timingFunction = [camediatimingFunction functionWithname:kcamediatimingFunctionlinear]; cloudLayerAnimation.fromValue = [NSValue valueWithCGPoint:startPoint]; cloudLayerAnimation.tovalue = [NSValue valueWithCGPoint:endPoint]; cloudLayerAnimation.repeatCount = HUGE_VALF; cloudLayerAnimation.duration = 3.0; [self applyCloudLayerAnimation];}- (voID)applyCloudLayerAnimation { [cloudLayer addAnimation:cloudLayerAnimation forKey:@"position"];}- (voID)vIEwDIDUnload { [self setCloudsImageVIEw:nil]; [super vIEwDIDUnload]; // Release any retained subvIEws of the main vIEw. // e.g. self.myOutlet = nil;}- (voID)vIEwDIDAppear:(BOol)animated { [super vIEwDIDAppear:animated]; [[NSNotificationCenter defaultCenter] addobserver:self selector:@selector(applicationWillEnterForeground:) name:UIApplicationWillEnterForegroundNotification object:nil];}- (voID)vIEwWilldisappear:(BOol)animated { [super vIEwWilldisappear:animated]; [[NSNotificationCenter defaultCenter] removeObserver:self name:UIApplicationDIDBecomeActiveNotification object:nil];}- (voID)dealloc { [[NSNotificationCenter defaultCenter] removeObserver:self name:UIApplicationWillEnterForegroundNotification object:nil];}- (voID)applicationWillEnterForeground:(NSNotification *)note { [self applyCloudLayerAnimation];} 总结

以上是内存溢出为你收集整理的objective-c – 以无缝循环动画无限滚动图像全部内容，希望文章能够帮你解决objective-c – 以无缝循环动画无限滚动图像所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。