Я хочу иметь кнопку в своем проекте React Native, которая должна открывать модальное всплывающее окно при нажатии. Однако мне бы хотелось, чтобы модал был из того же «материала», что и кнопка, и открывался с плавной анимацией, где кнопка становится модальной. Я создал атрибуты d
пути SVG, в результате чего следующие два состояния path
:
![enter image description here](https://i.stack.imgur.com/ytxeH.png)
TRY 1
Теперь я добавляю Animated
API-анимацию, но, к сожалению, ничего не происходит, и я предполагаю, что это просто потому, что нечего интерполировать, поскольку атрибут d
является строкой, но я нужен номер, который можно как-то интерполировать.
TRY 2
Итак, еще одна моя попытка состояла в том, чтобы создать путь круга с тем же количеством вершин, что и модальный путь, а затем использовать значения координат для интерполяции. Тем не менее, я использую Inkscape для экспорта SVG, но результирующий атрибут d
круга не совпадает с модальным с точки зрения отсутствия одинаковых команд SVG (например, таких как вертикальная линия v
или кривая Безье * 1025). *).
Вопрос
Поэтому я был бы рад, если кто-нибудь знает способ анимации пути SVG описанным способом. Будь то использование библиотеки, которую я пропустил до сих пор, или манипулирование SVG таким образом, чтобы я мог использовать его для интерполяции значений с помощью React Native Animated
API.