如何为具有性能的多边形蒙版制作动画？答案

【问题标题】：How to animate a polygon mask with performance?如何为具有性能的多边形蒙版制作动画？
【发布时间】：2010-01-08 16:12:16
【问题描述】：

我遇到了性能问题。

我创建了一个 UIView 并覆盖了它的 drawRect 函数。在这个函数中，我正在绘制一个图像（大的），然后在整个屏幕上绘制一个白色方块，里面有一个多边形，带有 CGContextEOFillPath。结果是一个白色屏幕，其中显示了图像的一部分（由多边形定义）。

之后，我创建了一个函数来动画该多边形到另一个多边形的过渡。除了多边形动画，图像也应该被缩放和移动以固定在屏幕上的显示。我用 NSTimer 做到了这一点。多边形的动画包括计算每个顶点之间的距离，然后根据 elapsedTime 移动到一个位置。它在模拟器上运行良好，但在设备上却卡住了。

阅读有关性能的信息，在 stackoverflow 上，我找到了使用 beginAnimations 和 commitAnimations 的替代方法。我正在更改所有内容以使用该方法处理图像。但是我能用多边形做什么。多边形是用CGContextMoveToPoint和CGContextAddLineToPoint绘制的，所以我相信它不能用beginAnimations动画。我正确吗？有没有更好的方法来做到这一点？

想要的结果类似于这个漫画阅读器应用程序：http://www.comixology.com/iphoneapp（点击导览。在视频中间他们显示“自动遮罩”功能）

【问题讨论】：

标签： iphone uiview

【解决方案1】：

我的建议是使用覆盖在主图像视图上的CAShapeLayer，CAShapeLayer 是您要遮盖的视图的大小，并在其中心有一个孔的多边形路径。 CAShapeLayers 让您可以平滑地从一个 CGPathRef 动画到另一个，只要两条路径具有相同数量的控制点。您需要在此处使用 CABasicAnimation 来执行该动画，而不是 UIView begin / commitAnimations 块，但这并不太难。

Joe Ricioppo 在他的帖子 here 中有一个很好的 CAShapeLayer 路径动画示例。

【讨论】：

谢谢，我会先尝试这种方法，如果我没有成功，我会尝试 Adrian 的方法。在那之后，我讨厌答案，好吗？再次感谢！

【解决方案2】：

使用 Core Animation，您可以为“动画”（原文如此）属性设置动画。 Apple 的文档列举了 Mac OS X 中的动画属性：

http://url.akosma.com/55

对于 iPhone，UIView 文档明确表示当给定属性是可动画的时，UIView 文档是“可动画的”。其中最强大的是（恕我直言）UIView 的“transform”属性，它将 CGAffineTransform 结构作为输入，或 CALayer 的“transform”属性（采用 CATransform3D 结构）。两者都具有动画效果，并赋予您强大的力量来创建您想要的任何类型的过渡。

现在，在您的情况下，确实不能以“简单”的方式为多边形设置动画。我敢打赌，在您的情况下，您会尝试映射满足您需求（缩放、翻译）的 CGAffineTransforms，并将其应用于使用您的 Quartz 代码创建的非动画固定视图。

我希望我足够清楚:)

【讨论】：