Как анимировать иконки в TabLayout с помощью анимированного векторного рисования? - PullRequest
Новая
       33

Как анимировать иконки в TabLayout с помощью анимированного векторного рисования?

0 голосов
/ 13 мая 2019

Я пытаюсь анимировать значки в tablayout в моем приложении для Android.
Я пытался использовать анимированные векторные рисунки и AnimatedStateListDrawable, с включенным состоянием и выключенным состоянием, и с созданной мной анимацией.используя shapehifter, но ничего не работает.
Я пытался сделать его как приложение для часов Android.
Примерно так:

enter image description here

Я получилвдохновленный этим блогом и попытавшийся сделать это:

Вот что я сделал:

anim_dwbl_bus.xml 

<animated-selector xmlns:tools="http://schemas.android.com/tools"
    xmlns:android="http://schemas.android.com/apk/res/android"
    tools:targetApi="lollipop">

    <!-- provide a different drawable for each state-->
    <item android:id="@+id/state_on"
        android:drawable="@drawable/ic_location_on_black_24dp"
        android:state_checked="true"/>
    <item android:id="@+id/state_off"
        android:drawable="@drawable/inactive_location"/>

    <!-- specify transitions -->
    <transition
        android:drawable="@drawable/avd_anim"
        android:fromId="@id/state_off"
        android:toId="@id/state_on"/>

</animated-selector>

inactive_location.xml 

<vector android:height="24dp" android:tint="#FFFFFF"
    android:viewportHeight="24.0" android:viewportWidth="24.0"
    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="#FFF" android:pathData="M12,2C8.13,2 5,5.13 5,9c0,5.25 7,13 7,13s7,-7.75 7,-13c0,-3.87 -3.13,-7 -7,-7zM12,11.5c-1.38,0 -2.5,-1.12 -2.5,-2.5s1.12,-2.5 2.5,-2.5 2.5,1.12 2.5,2.5 -1.12,2.5 -2.5,2.5z"/>

ic_location_on_black_24dp.xml 

<vector android:height="24dp" android:tint="#FFFFFF"
    android:viewportHeight="24.0" android:viewportWidth="24.0"
    android:width="24dp"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <path android:fillColor="#FFF" android:pathData="M12,2C8.13,2  5,5.13 5,9c0,5.25 7,13 7,13s7,-7.75 7,-13c0,-3.87 -3.13,-7 -7,-7zM12,11.5c-1.38,0 -2.5,-1.12 -2.5,-2.5s1.12,-2.5 2.5,-2.5 2.5,1.12 2.5,2.5 -1.12,2.5 -2.5,2.5z"/>

</vector>

avd_anim.xml 

<animated-vector
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt">

    <aapt:attr name="android:drawable">
        <vector
            android:name="vector"
            android:width="24dp"
            android:height="24dp"
            android:viewportWidth="24"
            android:viewportHeight="24">
            <group android:name="group">
                <path
                    android:name="path"
                    android:pathData="M 12 2 C 8.13 2 5 5.13 5 9 C 5 14.25 12 22 12 22 C 12 22 19 14.25 19 9 C 19 5.13 15.87 2 12 2 Z M 12 11.5 C 10.62 11.5 9.5 10.38 9.5 9 C 9.5 7.62 10.62 6.5 12 6.5 C 13.38 6.5 14.5 7.62 14.5 9 C 14.5 10.38 13.38 11.5 12 11.5 Z"
                    android:fillColor="#FFFFFF"/>
            </group>
        </vector>
    </aapt:attr>
    <target android:name="group">
        <aapt:attr name="android:animation">
            <objectAnimator
                android:propertyName="translateY"
                android:duration="500"
                android:valueFrom="-10"
                android:valueTo="0"
                android:valueType="floatType"
                android:interpolator="@android:interpolator/fast_out_slow_in"/>
        </aapt:attr>
    </target>
</animated-vector>

и в табло выложу это так: 

<android.support.design.widget.TabItem
    android:id="@+id/tabItem3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:icon="@drawable/anim_dwbl_bus"
    android:text="@string/tab_text_3" />

Пожалуйста, поделитесь своими мыслями и предложениями.Спасибо.

...