CABasicAnimation - 在视网膜设备上无限滚动图像出现乱码答案

【问题标题】：CABasicAnimation - Infinite scrolling of an image on retina device is garbledCABasicAnimation - 在视网膜设备上无限滚动图像出现乱码
【发布时间】：2023-08-15 13:19:01
【问题描述】：

在一个类似的帖子中，我找到了一个无限动画滚动图像的解决方案：

Animate infinite scrolling of an image in a seamless loop

虽然此解决方案运行良好，但在视网膜设备上运行时似乎存在问题。特别是，我只在 iPad 上运行这个项目。非视网膜 iPad 2 滚动图像没有任何问题。但是在视网膜 iPad 3 或 4 上运行图像是一团糟！这很难描述，但我能说的最好的就是它是乱码。像素被拉伸到各个方向。它类似于杰克逊·波拉克 (Jackson Pollak) 的画作。

屏幕截图：

http://imgur.com/Q7n08kv

我使用非视网膜图像（非 2x）和视网膜版本（@2x）对此进行了测试。图像很大 - 全屏（横向），宽 4 个面板 (4096 x 768)。我尝试了一些较小的图像，但结果相同。

CABasicAnimation 的滚动功能是否存在会影响视网膜设备的限制？这是我正在使用的代码（由 rob mayoff 提供）：

UIImage *crawlImage = [UIImage imageNamed:@"CrawlBackground.png"];
UIColor *crawlPattern = [UIColor colorWithPatternImage:crawlImage];
self.crawlLayer = [CALayer layer];
self.crawlLayer.backgroundColor = crawlPattern.CGColor;

self.crawlLayer.transform = CATransform3DMakeScale(1, -1, 1);
self.crawlLayer.anchorPoint = CGPointMake(0, 1);

self.crawlLayer.frame = CGRectMake(0, 0, crawlImage.size.width + 1024, crawlImage.size.height);

[self.backgroundCrawl.layer addSublayer:self.crawlLayer];
self.backgroundCrawl.layer.zPosition = 0;

CGPoint startPoint = CGPointZero;
CGPoint endPoint = CGPointMake(-crawlImage.size.width, 0);

self.crawlLayerAnimation = [CABasicAnimation animationWithKeyPath:@"position"];
self.crawlLayerAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
self.crawlLayerAnimation.fromValue = [NSValue valueWithCGPoint:startPoint];
self.crawlLayerAnimation.toValue = [NSValue valueWithCGPoint:endPoint];
self.crawlLayerAnimation.repeatCount = HUGE_VALF;
self.crawlLayerAnimation.duration = 30;   // nn seconds to complete the cycle

【问题讨论】：

也许您可以将屏幕截图上传到 imgur.com 并发布指向它的链接。
我已经编辑了问题并添加了一个指向问题外观屏幕截图的链接。

标签： objective-c xcode cabasicanimation

【解决方案1】：

self.crawlLayer = [CALayer layer];

一旦你创建了一个层，你应该设置它的contentsScale：

self.crawlLayer.contentsScale = [[UIScreen mainScreen] scale];

否则它可能无法在双分辨率屏幕上正确显示。

【讨论】：

【解决方案2】：

self.crawlLayer.contents = (id)crawlImage.CGImage;

或：

self.crawlLayer.contents = (__bridge id)([crawlImage CGImage]);

这应该可以解决它。允许大图像正确滚动。

【讨论】：