Animated vector drawable (NFC icon)

demo.webm

ic_nfc_black_animated.xml

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

    <target android:name="outline">
        <aapt:attr name="android:animation">
            <objectAnimator
                android:interpolator="@android:anim/accelerate_decelerate_interpolator"
                android:duration="1200"
                android:propertyName="trimPathEnd"
                android:repeatMode="restart"
                android:valueFrom="0"
                android:valueTo="1"
                android:valueType="floatType" />
        </aapt:attr>
    </target>

    <target android:name="innerLine">
        <aapt:attr name="android:animation">
            <objectAnimator
                android:interpolator="@android:anim/accelerate_decelerate_interpolator"
                android:duration="1200"
                android:propertyName="trimPathEnd"
                android:repeatMode="restart"
                android:valueFrom="0"
                android:valueTo="1"
                android:valueType="floatType" />
        </aapt:attr>
    </target>

    <target android:name="dot">
        <aapt:attr name="android:animation">
            <set>
                <objectAnimator
                    android:interpolator="@android:anim/bounce_interpolator"
                    android:duration="800"
                    android:propertyName="scaleX"
                    android:repeatMode="reverse"
                    android:repeatCount="-1"
                    android:valueFrom="0.8"
                    android:valueTo="1.2"
                    android:valueType="floatType" />
                <objectAnimator
                    android:interpolator="@android:anim/bounce_interpolator"
                    android:duration="800"
                    android:propertyName="scaleY"
                    android:repeatMode="reverse"
                    android:repeatCount="-1"
                    android:valueFrom="0.8"
                    android:valueTo="1.2"
                    android:valueType="floatType" />
            </set>
        </aapt:attr>
    </target>

</animated-vector>

ic_nfc_opt_black_64dp.xml

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

    <path
        android:name="outline"
        android:strokeColor="#FF000000"
        android:strokeWidth="6"
        android:pathData="M8 8 H56 V56 H8 V5 Z"
        />

    <path
        android:name="innerLine"
        android:strokeColor="#FF000000"
        android:strokeWidth="6"
        android:pathData="M26 18 L18 18 V46 H46 V18 H36 C34 18 32 18 32 20 V32"
        />

    <group
        android:name="dot"
        android:pivotX="32"
        android:pivotY="32"
        >

        <path
            android:fillColor="#FF000000"
            android:pathData="M 32 26 A 6 6 360 1 1 31.5 26 z"
            />

    </group>

</vector>

view.xml

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--remember to add "vectorDrawables.useSupportLibrary = true" in the gradle build file-->
    <!--to start the animation "(animatedNfcLogo.drawable as? AnimatedVectorDrawable)?.start()"-->
    <ImageView
        android:id="@+id/animatedNfcLogo"
        android:layout_width="156dp"
        android:layout_height="156dp"
        app:tint="@color/colorAccent"
        app:srcCompat="@drawable/ic_nfc_black_animated"
        />

</FrameLayout>