OStack程序员社区-中国程序员成长平台

标题: ios - 为 CALayer 的蒙版制作动画 [打印本页]

---

作者: 菜鸟教程小白    时间: 2022-12-13 05:32
标题: ios - 为 CALayer 的蒙版制作动画

目标:
我正在绘制一个具有渐变的自定义形状。我还想通过让它从左到右绘制来动画这个形状的绘图。

问题:
下面的代码适用于 iPad 模拟器，但不适用于我运行 iOS 7 的 iPad 4。有谁知道如何在设备上运行它？是否有不同的方法来实现相同的结果？

我的代码说明:
我的代码使用 3 个 CALayers(仅在模拟器上)有效。

• gradientLayer 保存我的渐变。
• shapeMaskLayer 包含我的自定义形状。
• animationMaskLayer 动画它的路径以模拟从左到右的绘图

animationMaskLayer --masks--> shapeMaskLayer --masks--> gradientLayer

然后我对 animationMaskLayer 的框架进行动画处理，以对整个形状进行动画处理。

代码:

// Animation Mask Rects
CGPathRef leftStartingRectPath = CGPathCreateWithRect(CGRectMake(0, 0, 0, self.frame.size.height), 0);
CGPathRef fullViewRectPath = CGPathCreateWithRect(CGRectMake(0, 0, self.frame.size.width, self.frame.size.height), 0);

// Animation Mask Layer
CAShapeLayer *animationMaskLayer = [CAShapeLayer layer];
animationMaskLayer.path = fullViewRectPath;
animationMaskLayer.fillColor = UIColor.blackColor.CGColor;

// Shape Mask Layer
CAShapeLayer *shapeMaskLayer = [CAShapeLayer layer];
shapeMaskLayer.path = CGPathCreateWithEllipseInRect(self.bounds, 0);
shapeMaskLayer.fillColor = [UIColor blueColor].CGColor;
shapeMaskLayer.mask = animationMaskLayer;

// Gradient Layer
CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = self.bounds;
gradientLayer.colors = self.colors;
gradientLayer.mask = shapeMaskLayer;
mountainLayer.anchorPoint = pt(0, 0);
mountainLayer.position = pt(0, 0);
[self.layer addSublayer:gradientLayer];

// Left To Right Animation
CABasicAnimation *leftToRightAnimation = [CABasicAnimation animationWithKeyPath"path"];
leftToRightAnimation.duration = 0.5;
leftToRightAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
leftToRightAnimation.fromValue = (__bridge id)leftStartingRectPath;
leftToRightAnimation.toValue = (__bridge id)fullViewRectPath;
leftToRightAnimation.fillMode = kCAFillModeForwards;
leftToRightAnimation.removedOnCompletion = NO;
[animationMaskLayer addAnimation:leftToRightAnimation forKey"animatePath"];

// Memory Management
CGPathRelease(leftStartingRectPath);
CGPathRelease(fullViewRectPath);

---

Best Answer-推荐答案

动画面具的面具？我很惊讶它甚至可以在模拟器中运行。

您是否尝试过嵌套两层，父层启用 masksToBounds？然后您可以在两个层上设置一个独立的掩码，外层将有效地用它自己的掩码掩蔽您的内层(由于 masksToBounds)。哪一层得到哪个 mask 可能并不重要(因为您想要两个 mask 的交集)。

使用您在问题中列出的代码，您只需添加一行并注释掉一行即可获得正确的功能:

self.layer.mask = animationMaskLayer;
//    shapeMaskLayer.mask = animationMaskLayer;

关于ios - 为 CALayer 的蒙版制作动画，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20132875/

---

欢迎光临 OStack程序员社区-中国程序员成长平台 (https://ostack.cn/)

Powered by Discuz! X3.4