Использование анимации просмотра в Android

С анимациями просмотра вы можете анимировать масштаб, положение, вращение и альфа любого вида. В этой статье, основанной на главе 10 пользовательского интерфейса Android , автор представляет тип анимации View, который позволяет применять анимацию к каждому дочернему представлению в макете по мере его добавления или удаления.

Макет анимации

Android имеет три основных типа анимации. Они есть:

• Рамочный
• Просмотр на основе
• Недвижимость на основе

Эти три типа анимации делятся на две категории: кадровая анимация и анимация движения. Неудивительно, что анимации на основе кадров представляют собой тип анимации кадров, тогда как анимации на основе представлений и свойств представляют собой типы анимации движения.

Кадровая анимация — это один из самых простых и простых типов анимации. Этот тип анимации реализуется путем отображения последовательности слегка меняющихся изображений одно за другим. Отображая эти изображения в быстрой последовательности, мы получаем плавную анимацию.

В отличие от анимации на основе кадров, где мы должны явно определять каждое изображение для каждого кадра анимации, для анимации на основе анимации движения нам нужно только определить количество ключевых точек в анимации, и система создает промежуточные кадры для нас. , Например, если мы хотим анимировать вращение квадрата, мы можем указать начальный угол 0 градусов и конечный угол 45 градусов. Когда мы воспроизводим анимацию, система создает и отображает промежуточные кадры, чтобы обеспечить плавное вращение анимации. На рисунке 1 изображен квадрат, анимированный вращением его от 0 до 45 градусов. Пунктирный квадрат представляет промежуточное или промежуточное значение, которое рассчитывается системой анимации.

Рисунок 1 Поворот квадрата с измененными значениями

Посмотреть анимацию

Анимация просмотра — анимация на основе анимации. С анимацией просмотра мы можем только анимировать виды. Анимации на основе вида используют ряд классов, которые можно найти в пакете android.view.animation. С этим типом анимации мы можем применить четыре различных анимационных эффекта к видам, это:

• Масштабная анимация — изменение размера.
• Перевести анимацию — перемещение представления
• Альфа-анимация — настройка прозрачности вида.
• Повернуть анимацию — повернуть вид на заданный угол.

Для каждой из анимаций у нас есть соответствующий класс анимации в android.view.animations. Все классы анимации расширяют общий абстрактный класс Animation. На рисунке 2 показана иерархия классов для этих классов.

Рисунок 2 Иерархия классов для представления Анимации

Обратите внимание, что на рисунке 2 мы также показали класс AnimationSet. Этот класс позволяет группировать анимации и ставить хореографию, как они воспроизводятся. Набор AnimationSet позволяет одновременно воспроизводить несколько анимаций или организовывать их для последовательного воспроизведения.

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

Давайте посмотрим на создание анимации макета, которая включает в себя использование анимации перевода.

Макет анимации

В анимации просмотра у нас также есть анимации макета. С Android также можно применять анимацию к макетам. Анимации макета позволяют применять анимацию к каждому дочернему виду макета по мере его добавления или удаления. В макете анимации нам не нужно явно запускать анимацию; он будет запущен при отображении макета. Android использует класс LayoutAnimationController для анимации макета. Любой класс ViewGroup в Android может иметь класс LayoutAnimationController. Это означает, что мы можем применить анимацию макета к любому типу макета, например LinearLayout, или к любому типу AdapterView, например ListView.

LayoutAnimationController может быть определен в Java или XML, но чаще всего он определяется в XML. Таблица 1 показывает атрибуты для LayoutAnimationController.

LayoutAnimationController имеет ряд атрибутов, которые управляют применением анимации макета. У вас есть атрибут animation, который определяет анимацию, которая будет применяться к каждому дочернему представлению в макете. Это может быть простая одиночная анимация или более сложный набор анимации. Атрибут delay устанавливает время между запусками анимации для каждого дочернего элемента в макете. Это процентное значение. Вы также можете установить порядок анимации. Это может быть установлено как нормальное, что означает, что первый дочерний элемент в макете добавляется первым; наоборот, последний потомок добавляется первым или случайным образом; наконец, вы также можете установить интерполятор для изменения скорости изменения между задержками анимации.

В качестве примера, вот LinearLayout с примененной к нему анимацией макета. Здесь у нас есть очень простая LinearLayout с тремя текстовыми представлениями.

Рисунок 3 Простая LinearLayout с TextViews

Мы определили очень простой линейный макет, но нам нужно добавить один очень важный атрибут — атрибут анимации макета, который указывает, какой контроллер макета мы будем использовать для анимации TextView в макете. XML для этого контроллера LayoutAnimation показан в листинге 1.

<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:delay="25%"
    android:animationOrder="normal"
    android:animation="@android:anim/slide_in_left" />

Этот LayoutAnimationController использует анимацию перевода, которая приводит к появлению TextViews с левой стороны экрана. Эта анимация перевода позволяет перемещать представления по экрану. С помощью этой анимации вы можете перемещать виды по осям X и Y. В качестве примера давайте рассмотрим анимацию перевода, которая берет ImageView и перемещает его вправо и за пределы экрана.

Рисунок 4 Перемещение ImageView с анимацией перевода

Когда эта анимация перевода используется вместе с LayoutAnimationController, она приводит к перемещению каждого TextView на экран один за другим, начиная с самого верхнего TextView.

Рисунок 5 TextViews анимированные на макете

Чтобы собрать все это вместе, мы просто загружаем макет через Activity. Это анимация макета, поэтому нам не нужно ее запускать. В листинге 2 показано действие, используемое для запуска этого примера.

public class AnimateLayoutActivity extends Activity {

    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_layout_animation);
    }
}

То, что мы показали здесь, является простым примером того, что можно сделать с помощью анимации макета. Этот тип анимации может использоваться с любым типом ViewGroup, включая AdapterViews, например ListView и GridView. Фактически, GridView имеет свой собственный тип контроллера анимации макета, GridLayoutAnimationController. Этот контроллер расширяет LayoutAnimationController, чтобы мы могли контролировать последовательность анимаций на основе столбцов и строк. Дополнительные примеры использования макетов анимации можно найти в демонстрационном коде API на веб- сайте разработчиков Google .

Резюме

Анимации просмотра просты для понимания и использования и дают отличный способ анимировать представления Android. С анимациями просмотра вы можете анимировать масштаб, положение, вращение и альфа любого вида. Чтобы создавать более сложные анимации, вы также можете сгруппировать анимации просмотра в наборы, используя различные типы интерполяторов для достижения реалистичного движения. В этой статье мы сосредоточились на анимации макета, типе анимации View, которая позволяет применять анимацию к каждому дочернему представлению в макете по мере его добавления или удаления.

Некоторые другие названия Мэннинга, которые могут вас заинтересовать