预渲染的 Core Graphics 动画不流畅且占用内存

Question

我发布这个问题是为了回应 on my previous question here:

之一

所以，现在我尝试使用预渲染动画方法，我仍然无法获得流畅的动画。不仅如此，当运行在实际设备上时，应用程序会因内存问题定期崩溃。

您可以在此处查看动画运行ning：http://cl.ly/e3Qu（从视频上看可能没那么糟糕，但专注于动画的边缘，在实际设备上表现更差.)

这是我的代码：

static CGFloat const animationDuration = 1.5;
static CGFloat const calculationRate = (1.0/40.0); // 40fps max.
static CGFloat const calculationCycles = animationDuration/calculationRate;


@implementation splashView {

    CADisplayLink* l;

    CGImageRef backgroundImg;

    UIColor* color;

    NSMutableArray* animationImages;

    NSTimeInterval currentTime;
}

-(void) beginAnimating {
    static dispatch_once_t d;
    dispatch_once(&d, ^{

        CGFloat totalDistance = 0;
        CGFloat screenProgress = 0;
        CGFloat deltaScreenProgress = 0;


        totalDistance = screenHeight()+screenWidth();

        color = [[lzyColors colors] randomColor];

        backgroundImg = textBG(color, screenSize()).CGImage;

        animationImages = [NSMutableArray array];

        NSLog(@"start");

        UIGraphicsBeginImageContextWithOptions(screenSize(), YES, 0);

        CGContextRef c = UIGraphicsGetCurrentContext();

        for (int i = 0; i <= (calculationCycles+1); i++) {

            UIImage* img = lzyCGImageFromDrawing(^{

                CGFloat height = screenHeight();
                CGFloat width = screenWidth();

                CGMutablePathRef p = CGPathCreateMutable();

                CGPoint startingPoint = [self pointBForProgress:screenProgress];

                CGPathMoveToPoint(p, nil, startingPoint.x, startingPoint.y);
                lzyCGPathAddLineToPath(p, [self pointAForProgress:screenProgress]);
                if ((width < screenProgress) && (screenProgress-deltaScreenProgress) < width) {
                    lzyCGPathAddLineToPath(p, (CGPoint){width, 0});
                }
                if (deltaScreenProgress != 0) lzyCGPathAddLineToPath(p, [self pointAForProgress:screenProgress-deltaScreenProgress-1]);
                if (deltaScreenProgress != 0) lzyCGPathAddLineToPath(p, [self pointBForProgress:screenProgress-deltaScreenProgress-1]);
                if ((height < screenProgress) && (screenProgress-deltaScreenProgress) < height) {
                    lzyCGPathAddLineToPath(p, (CGPoint){0, height});
                }
                CGPathCloseSubpath(p);

                CGContextAddPath(c, p);
                CGContextClip(c);
                CGPathRelease(p);

                CGContextSetFillColorWithColor(c, color.CGColor);
                CGContextFillRect(c, self.bounds);


                CGContextDrawImage(c, self.bounds, backgroundImg);

            });


            [animationImages addObject:img];

            deltaScreenProgress = screenProgress;
            screenProgress = (i*totalDistance)/calculationCycles;
            deltaScreenProgress = screenProgress-deltaScreenProgress;
        }


        NSLog(@"stop");


        currentTime = 0;

        l = [CADisplayLink displayLinkWithTarget:self selector:@selector(displayLinkDidFire)];
        [l addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSRunLoopCommonModes];

    });


}

-(void) displayLinkDidFire {

    NSTimeInterval deltaTime = l.duration;
    currentTime += deltaTime;

    if (currentTime <= animationDuration) {

        CGFloat prg = (currentTime/animationDuration);
        NSInteger image = roundf(([animationImages count]-1)*prg);

        [CATransaction begin];
        [CATransaction setDisableActions:YES];
        self.layer.contents = (__bridge id _Nullable)(((UIImage*)[animationImages objectAtIndex:image]).CGImage);
        [CATransaction commit];
    } else {

        [CATransaction begin];
        [CATransaction setDisableActions:YES];
        self.layer.contents = (__bridge id _Nullable)(((UIImage*)[animationImages lastObject]).CGImage);
        [CATransaction commit];
        [l invalidate];
        animationImages = nil;
    }

}


-(CGPoint) pointAForProgress:(CGFloat)progressVar {
    CGFloat width = screenWidth();
    return (CGPoint){(progressVar<width)?progressVar:width+1, (progressVar>width)?progressVar-width:-1};
}

-(CGPoint) pointBForProgress:(CGFloat)progressVar {
    CGFloat height = screenHeight();
    return (CGPoint){(progressVar>height)?(progressVar-height):-1, (progressVar<height)?progressVar:height+1};
}

@end

textBG() 函数只是做一些相当简单的 Core Graphics 绘图来获取背景图像。

我只能假设我在这里做了一些根本性的错误，但我想不出它是什么。

关于如何提高性能和减少内存消耗（不降低动画质量）有什么建议吗？

Answer 1

通过层内容动画全屏图像肯定会出现性能和内存问题，尤其是在@3x 设备上。对于您在另一个问题 (this video) 中展示的动画，看起来您实际上根本不需要任何遮罩——创建一系列矩形纯色图层（黑色、浅紫色、中紫色, 深紫色), 将它们从前到后分层(文本层在浅层和中层之间), 将它们旋转到你需要的角度, 并根据需要移动它们。

如果您最终需要更复杂的动画，而该方法将无法适用——或者通常来说，无法为任意全屏内容制作动画——您需要 (1) 将其预渲染为视频（离线或使用 AVFoundation API）并以这种方式播放或 (2) 使用 OpenGL 或 Metal 进行绘图。

Answer 2

你遇到的问题是一些动画逻辑写得不好，它基本上是在内存中分配一大堆图像，这种方式迟早会导致你的设备崩溃。您需要使用一种更好的方法重新开始，该方法不会同时将所有图像数据拉入内存。不要只是尝试调整您已有的东西，因为以前的开发人员所做的基本假设是完全错误的。请参阅我之前的类似问题示例，了解一些很好的链接，例如 "video-and-memory-usage-on-ios-devices" 一个：

预渲染的 Core Graphics 动画不流畅且占用内存

Pre-rendered Core Graphics animation doesn't animate smoothly & hogs memory

performance

core-animation

core-graphics

objective-c

ios