Floating Action Button в Android Studio — часть 2

В этом уроке мы продолжим рассматривать возможности анимации летающей кнопки Floating Action Button.

Для этого используем проект, созданный в предыдущем уроке, где мы делали эффект плавного скрытия и появления кнопки, и создадим для этой кнопки дополнительный эффект вращения. Если вы ещё не успели ознакомиться с предыдущим уроком, то рекомендую начать с него. Давайте теперь перейдём к каталогу ресурсов проекта. Здесь зайдём в каталог anim, в котором хранятся файлы с настройкой анимации. И первым делом откроем файл, отвечающий за скрытие кнопки, т.е. fab_hide.xml. К двум существующим в нём элементам scale и alpha добавим элемент rotate. Именно этот элемент отвечает за вращение кнопки. После добавления содержимое файла fab_hide.xml должно быть следующим:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
     android:fillAfter="true"
     android:duration="1000"
     android:shareInterpolator="true">

    <scale
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:toXScale="0.0"
        android:toYScale="0.0"
        android:pivotX="50%"
        android:pivotY="50%" />

    <alpha
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

    <rotate
        android:fromDegrees="0"
        android:toDegrees="-360"
        android:pivotX="50%"
        android:pivotY="50%"
        />
</set>

Атрибут элемента rotate fromDegrees отвечает за угол наклона кнопки Floating Action Button вправо, или влево на момент начало анимации. А атрибут toDegrees определяет угол, на который будет повёрнута кнопка за установленный период анимации. Значения углов определяется в градусах, т. е. 360 будет означать полный оборот кнопки за период анимации, продолжительность которой определяет duration="1000″. Знак «-» (минус) означает, что вращение будет происходить против часовой стрелки. Если необходимо, чтобы кнопка за период анимации делала два полных оборота, то нужно указать 360 * 2, т.е. 720 градусов. Атрибуты pivotX и pivotY определяют координату центра по осям X и Y, относительно которой будет происходить вращение кнопки. Т.е. в данном случаи центром вращения кнопки будет геометрический центр самой кнопки.

Теперь перейдём к файлу, который отвечает за появление кнопки, т.е. к fab_show.xml. Туда также добавим элемент rotate, только значение атрибута toDegrees изменим с отрицательного на положительное. Его содержимое должно стать следующим:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true"
android:duration="1000"
android:shareInterpolator="true">

<scale
android:fromXScale="0.0"
android:fromYScale="0.0"
android:toXScale="1.0"
android:toYScale="1.0"
android:pivotX="50%"
android:pivotY="50%" />

<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0" />

<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
/>

</set>

Подробнее смотрите в видеоролике.