Rive анимация

Rive — это инструмент интерактивного дизайна и анимации в реальном времени. С помощью виджета RiveAnimation вы можете легко импортировать активы Rive во FlutterFlow и использовать их в своем приложении.

Вы можете создать анимацию с нуля с помощью редактора Rive Editor.

1. Нажмите + Новый файл.
2. Укажите размеры артборда (ширина и высота).
3. Нажмите Создать.

Используйте инструменты дизайна Rive или импортируйте файлы изображений, чтобы начать разработку анимации. Когда дизайн будет готов, вы можете использовать временную шкалу и клавиши, чтобы легко анимировать ваш дизайн.

Узнайте больше о создании анимации Rive на следующей странице:

После завершения разработки анимации вы можете либо загрузить ее как актив (с расширением .riv), либо поделиться ею с другими, опубликовав ее в сообществе Rive.

Чтобы загрузить Rive-файл, нажмите на значок экспорта (левый верхний угол панели инструментов Rive) и выберите Download -> For newest runtime.

Чтобы опубликовать файл в сообществе, нажмите на значок экспорта (левый верхний угол панели инструментов Rive) и выберите Publish to Community. Дайте название и описание вашей анимации и нажмите кнопку Опубликовать в сообщество.

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

Чтобы использовать анимацию Rive, выполните следующие действия:

1. Перетащите виджет RiveAnimation на холст.
2. Выберите источник анимации — Сеть или Актив.
3. Если вы выбрали «Сеть«, введите путь (URL загрузки) анимации. Получите путь, перейдя к анимации Rive, опубликованной в сообществе, щелкните правой кнопкой мыши на кнопке Download и скопируйте адрес ссылки.
4. Если вы выбрали Asset,
5. Выберите артборд из выпадающего списка.
6. Выберите анимации, которые вы хотите использовать (они импортируются из актива Rive). После выбора одной или нескольких анимаций вы можете воспользоваться кнопкой Preview Animations для их воспроизведения.
7. Тип анимации по умолчанию выбран как Однократно. Если выбранная анимация содержит цикл или бумеранг, то можно выбрать опцию Непрерывный. При выборе этой опции, если анимация содержит цикл, она будет воспроизводиться непрерывно.
8. По умолчанию флажок Auto Animate остается установленным, что означает, что анимация будет воспроизводиться сразу после загрузки страницы. Но если вы хотите использовать Action для запуска анимации, снимите этот флажок.
9. Укажите ширину и высоту виджета RiveAnimation и выберите тип Box Fit.
10. (Необязательно) Если вы планируете использовать действие для запуска анимации, вы можете дать соответствующее имя этому виджету RiveAnimation, чтобы его можно было легко идентифицировать.

Чтобы запустить воспроизведение RiveAnimation с помощью действия, вы можете использовать действие Animation. Ознакомьтесь с этой страницей, чтобы узнать, как использовать это действие.

• Вместо того Документация по Rive
• FlutterFlow использует пакет rive для анимаций Rive.создавать анимацию с нуля, вы также можете использовать любой актив Rive, размещенный в сообществе.