Android Studio включает в себя редактор визуального дизайна для типа макета MotionLayout , упрощающий создание и предварительный просмотр анимации.
Редактор движения предоставляет простой интерфейс для управления элементами из библиотеки MotionLayout, которая служит основой для анимации в приложениях Android. Без Android Studio создание и изменение этих элементов требует ручного редактирования ограничений в файлах ресурсов XML. Однако редактор движения может сгенерировать для вас этот XML-код с поддержкой начального и конечного состояний, ключевых кадров, переходов и временных шкал.
Чтобы начать работу с редактором движения:
- Создайте ConstraintLayout .
- Щелкните правой кнопкой мыши превью в редакторе макетов.
- Нажмите «Преобразовать в MotionLayout» , как показано ниже.
После того как Android Studio преобразует ваш ConstraintLayout в MotionLayout, файл Motion Scene (файл .xml с добавлением _scene к имени файла макета) также добавляется в каталог, содержащий ваш XML.
Затем MotionLayout становится корневым макетом и отображается в пользовательском интерфейсе редактора движений. Макет уже включает в себя начальный ConstraintSet , конечный ConstraintSet и переход от начала к концу.
Вы можете использовать обзорную графику, чтобы выбрать ConstraintSet или Transition , а также выбрать компоненты на панели выбора.
Затем вы можете редактировать ограничения и атрибуты начального или конечного ConstraintSet так же, как и ConstraintLayout .
Если вы хотите добавить больше элементов в свой график, вы можете использовать значки создания, чтобы быстро добавить жесты ConstraintSet , Transition или OnClick / OnSwipe .
Чтобы добавить ключевой кадр, сначала нажмите стрелку перехода :
Затем на панели временной шкалы перехода щелкните правый верхний угол и выберите KeyPosition :
Это действие открывает диалоговое окно, в котором вы можете установить атрибуты ключевого кадра.
Вы также можете добавить обработчики OnClick и OnSwipe к переходу на панели атрибутов.
Это действие открывает диалоговое окно, в котором вы можете установить атрибуты щелчка, такие как целевые компоненты и направление перетаскивания.
Редактор движения поддерживает предварительный просмотр анимации в области дизайна. Когда анимация выбрана, нажмите «Воспроизвести».
над временной шкалой, чтобы просмотреть анимацию.
