Круг с жидким / растягивающим ходом - PullRequest
0 голосов
/ 25 июня 2018

Я и моя команда работаем над приложением для клиента.Мы пытаемся понять, как добиться анимации такого типа ( относится только к обводке круга ):

enter image description here

Мы пыталисьиспользование CADisplayLink для настройки и изменения круга, но это дало не плавные результаты.Мы не смогли найти способ создать круг из «компонентов» из UIBezierPath и изменить каждый из якорей.

Любые предложения о том, как добиться такого рода эффекта или как построитькруг из разделенных точек, будет очень ценным

С наилучшими пожеланиями,
Рой и команда

1 Ответ

0 голосов
/ 25 июня 2018

Я предлагаю использовать сплайны Катмулла-Рома.Они позволяют вам создавать плавные кривые, используя только точки на кривой, тогда как кривые Безье требуют, чтобы вы определили контрольные точки, которые не находятся на кривой.

Как только вы начинаете и заканчиваете CGPath s, это довольно красиволегко создать CAAnimation пути от его начального до конечного состояния (хотя изменение анимации на CGPath работает правильно, только если начальный и конечный пути в анимации имеют одинаковое количество и тип точек.)

Возможно, вы также можете использовать кривые Безье, но вам нужно будет сгенерировать контрольные точки для круга и его искаженной формы.

Ознакомьтесь с этим примером приложения, в котором используются сплайны Catmull-Rom для создания искаженной формы круга:

http://wareto.com/animating-shapes-using-cashapelayer-and-cabasicanimation

(Написано в Objective-C, но методикато же самое в Swift.)

enter image description here

Сплайн Catmull-Rom с 8 контрольными точками, равномерно распределенными по кругу, где расстояние от центра каждого элемента управлениябаллы варьируются на ± r / 12 кажется правым:

enter image description here

...