Эффект Gooey в iOS

Я работаю над небольшим проектом, в котором я хотел бы, чтобы два круга соединились с эффектом «липкий». Я много искал в Интернете и натыкался на некоторые примеры в виде вкладки или меню боковой панели, но все это исправлено, а не то, что я ищу.Эффект Gooey в iOS

Что я в основном хочу, это following. Таким образом, есть круг, и если я перетаскиваю его вплотную к другому кругу, он защелкивается вместе, также известный как эффект «липкого» эффекта.

Образец кода будет лучшим, но направление/подход, как это сделать, также поможет мне.

источник

2017-01-28 Wouter125

Таким образом, вы хотите иметь этот эффект, когда пользователь взаимодействует с этим кругом, а затем эффект, который происходит, когда два круга встречаются или уходят. Правильно? –

вычисление точек текущей фигуры для кривой Безье может быть выполнено __ [элементарная геометрия] (https://en.wikipedia.org/wiki/Tangent_lines_to_circles) __; Я рекомендую это чтение как хорошее начало. – holex

Возможно, вы можете получить вдохновение в технике этого: https://github.com/yoavlt/LiquidFloatingActionButton – Lapinou

Интересная проблема.

Off верхней части моей головы, вот как я мог бы справиться с этим:

Расчет точки пересечения 2-х кругов (я нашел эту ссылку, что: Circle-circle intersection points)

Вычислить диапазоны дуги пересекающихся частей каждого круга.

Расширить диапазон дуги на несколько градусов. Определите дуги для остальных частей каждой окружности (части, которые будут нарисованы «не-gooey»)

Используя триггер и Catmull-Rom splines, создайте замкнутую траекторию для внешних «невзаимных» частей каждого круга.

Алгоритм Catmull-Rom должен заполнить промежутки между двумя частицами, используя плавные кривые, которые очень похожи на круги «Gooey», которые вы показываете.

У меня есть проект на GitHub, который включает Swift код для создания Catmull-Rom сплайны из серии точек: Trochoid demo

Этот проект создает открытые кривые, не замкнутые контуры. Техника создания сглаженных замкнутых траекторий с использованием сплайнов Catmull-Rom немного отличается. У меня есть другой проект Github под названием RandomBlobs (написанный в Objective-C), который создает сглаженные замкнутые пути. Вы должны иметь возможность решить, как изменить код Swift для создания закрытых путей из кода Objective-C. Это было достаточно долго, так как я написал код RandomBlobs, который не помню точно, что я сделал.

Я не уверен, что описанный выше подход будет достаточно быстрым, чтобы рисовать в режиме реального времени, но я уверен, что так будет. Этот проект TrochoidDemo делает лот триггера для каждого кадра анимации, и его анимация довольно плавная. Если ваш проект недостаточно плавный, вам может понадобиться сделать некоторую оптимизацию.

источник

2017-01-28 13:44:28

Звучит как интересный математический подход. Собираюсь прочитать об этом и посмотреть, смогу ли я работать над каким-то решением. Я не уверен, насколько я продвигаюсь в программировании, но хотел бы посмотреть, могу ли я придумать какое-то решение. Не ожидал, что это может стать таким трудным, в Интернете это всего лишь некоторые svg-фильтры ха-ха. Спасибо, что дал мне несколько ручек! Я очень ценю это, и, поскольку вопрос слишком широк, не зная, как сделать его более конкретным, я буду отмечать ваш как правильный ответ. :) – Wouter125

Я заметил, что в вашем примере два круга начинают искажаться, прежде чем они на самом деле коснутся. Использование внутренних касательных линий для выбора конечных точек кривой Безье, как было предложено @holex, было бы хорошим способом получить этот эффект, хотя я не уверен, как вы получите плавный переход от круга к Безье без изломов. –

@ DuncanC, да, это хорошее начало, но фактическое окончательное решение намного проще; что вам нужно для Безье? четыре центра, три радиуса; то вы будете писать линейные уравнения соединения центров, тогда вы можете вычислить четыре касательные точки на этих линиях, разделив вектор пропорционально; если у вас есть все это, построение кривой Безье - всего лишь кусок пирога, вам даже не нужны контрольные точки для Безье, потому что вы собираетесь нарисовать 4 регулярные дуги только с начальным и конечным углом. элементарной геометрии. ваше случайное догадки приведет к безумию. – holex

Эффект Gooey в iOS

ответ

Смежные вопросы