菜鸟教程小白 发表于 2022-12-13 05:32:31

ios - 为 CALayer 的蒙版制作动画


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

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

<p><strong>我的代码说明:</strong><br/>
我的代码使用 3 个 CALayers(仅在模拟器上)有效。 </p>

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

<p><code>animationMaskLayer --masks--> shapeMaskLayer --masks--> gradientLayer</code> </p>

<p>然后我对 <code>animationMaskLayer</code> 的框架进行动画处理,以对整个形状进行动画处理。</p>

<p><strong>代码:</strong></p>

<pre><code>// 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 = ;
animationMaskLayer.path = fullViewRectPath;
animationMaskLayer.fillColor = UIColor.blackColor.CGColor;

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

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

// Left To Right Animation
CABasicAnimation *leftToRightAnimation = ;
leftToRightAnimation.duration = 0.5;
leftToRightAnimation.timingFunction = ;
leftToRightAnimation.fromValue = (__bridge id)leftStartingRectPath;
leftToRightAnimation.toValue = (__bridge id)fullViewRectPath;
leftToRightAnimation.fillMode = kCAFillModeForwards;
leftToRightAnimation.removedOnCompletion = NO;
;

// Memory Management
CGPathRelease(leftStartingRectPath);
CGPathRelease(fullViewRectPath);
</code></pre></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>动画面具的面具?我很惊讶它甚至可以在模拟器中运行。</p>

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

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

<pre><code>self.layer.mask = animationMaskLayer;
//    shapeMaskLayer.mask = animationMaskLayer;
</code></pre></p>
                                   
                                                <p style="font-size: 20px;">关于ios - 为 CALayer 的蒙版制作动画,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/20132875/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/20132875/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: ios - 为 CALayer 的蒙版制作动画