Как анимировать маску многоугольника с производительностью?

Question

У меня проблема с производительностью.

Я создал UIView и переписал его функцию drawRect. При этой функции я рисовал изображение (большое) и поверх него белый квадрат на весь экран с многоугольником внутри него с помощью CGContextEOFillPath. В результате отображается белый экран с отображаемой частью изображения (определенной многоугольником).

После этого я создал функцию для анимации перехода этого многоугольника в другой. Помимо полигональной анимации, изображение также должно быть масштабировано и перемещено, чтобы зафиксировать изображение на экране. Я сделал это с NSTimer. Анимация многоугольника состоит в том, чтобы вычислить расстояние между каждой вершиной и затем переместиться в положение согласно elapsedTime. Он отлично работал на симуляторе, но на самом деле застрял на устройстве.

Читая о производительности, здесь, в stackoverflow, я нашел альтернативу для использования beginAnimations и commitAnimations. Я изменяю все, чтобы использовать этот подход с изображением. Но что я могу сделать с полигоном. Многоугольник рисуется с помощью CGContextMoveToPoint и CGContextAddLineToPoint, поэтому я считаю, что его нельзя анимировать с помощью beginAnimations. Я правильно? Есть ли лучший подход для этого?

Желаемый результат - что-то вроде этого приложения для чтения комиксов: http://www.comixology.com/iphoneapp (нажмите на экскурсию. В середине видео они показывают функцию «автоматической маскировки»)

Answer 1

Я бы предложил использовать CAShapeLayer , наложенный на ваш основной вид изображения, с CAShapeLayer размером с вид, который вы хотите замаскировать, и с многоугольной траекторией для отверстия в центре. , CAShapeLayers позволяют плавно анимировать один CGPathRef в другой, при условии, что два пути имеют одинаковое количество контрольных точек. Для этого вам нужно использовать CABasicAnimation, а не блок UIView begin / commitAnimations, но это не так уж сложно.

Джо Ричиоппо имеет хороший пример анимации путей CAShapeLayer в своем посте здесь .

Answer 2

С Core Animation вы можете анимировать «анимируемые» (sic) свойства. Документация Apple перечисляет анимируемые свойства в Mac OS X:

http://url.akosma.com/55

В случае с iPhone документация UIView явно говорит, что «animatable», когда заданное свойство, hum, animatable. Наиболее мощными из них являются (IMHO) свойство «transform» UIView, которое принимает структуры CGAffineTransform в качестве входных данных, или свойство «transform» CALayer (которое принимает структуры CATransform3D). Оба являются анимируемыми и дают вам огромные возможности для создания любого перехода, который вы хотите.

Теперь, в вашем случае, действительно, вы не можете анимировать многоугольник "легким" способом. Моя ставка была бы в вашем случае попытаться отобразить CGAffineTransforms, которые соответствуют вашим потребностям (масштабирование, перевод) и применить это к фиксированному представлению, не анимированному, созданному с использованием вашего кварцевого кода.

Надеюсь, я достаточно ясно:)