Add some animated icons to bottom nav

This commit is contained in:
Zakhar Timoshenko
2022-07-03 20:11:40 +03:00
parent b4f2b82a0d
commit 455351e3a8
19 changed files with 419 additions and 23 deletions

View File

@@ -0,0 +1,34 @@
<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">
<path
android:name="path"
android:pathData="M 5 5 L 8 5 L 8 18 L 5 18 Z M 9 3 L 12 3 L 12 18 L 9 18 Z M 3 19 L 21 19 L 21 21 L 3 21 Z"
android:fillColor="#000"
android:strokeWidth="1"/>
<path
android:name="path_1"
android:pathData="M 11.967 4.974 L 15.025 4.031 L 19.034 17.027 L 15.976 17.971 Z"
android:fillColor="#000"
android:strokeWidth="1"/>
</vector>
</aapt:attr>
<target android:name="path_1">
<aapt:attr name="android:animation">
<objectAnimator
android:propertyName="pathData"
android:duration="300"
android:valueFrom="M 15.025 4.031 L 11.967 4.974 L 15.976 17.971 L 19.034 17.027 L 15.025 4.031 M 6.5 11.5 L 6.5 11.5 L 6.5 11.5 L 6.5 11.5 L 6.5 11.5 M 10.5 10.5 L 10.5 10.5 L 10.5 10.5 L 10.5 10.5 L 10.5 10.5 M 12 20 L 12 20 L 12 20 L 12 20 L 12 20"
android:valueTo="M 19.2 4.4 L 16 4.4 L 16 18 L 19.2 18 L 19.2 4.4 M 5 5 L 8 5 L 8 18 L 5 18 L 5 5 M 9 3 L 12 3 L 12 18 L 9 18 L 9 3 M 3 19 L 21 19 L 21 21 L 3 21 L 3 19"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
</animated-vector>

View File

@@ -0,0 +1,29 @@
<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">
<path
android:name="path"
android:pathData="M 5 5 L 8 5 L 8 18 L 5 18 Z M 9 3 L 12 3 L 12 18 L 9 18 Z M 3 19 L 21 19 L 21 21 L 3 21 Z M 16 4.4 L 19.2 4.4 L 19.2 18 L 16 18 Z"
android:fillColor="#000"
android:strokeWidth="1"/>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<objectAnimator
android:propertyName="pathData"
android:duration="300"
android:valueFrom="M 16 4.4 L 19.2 4.4 L 19.2 18 L 16 18 L 16 4.4 M 9 3 L 9 18 L 12 18 L 12 3 L 9 3 M 5 5 L 5 18 L 8 18 L 8 5 L 5 5 M 3 19 L 21 19 L 21 21 L 3 21 L 3 20 L 3 19"
android:valueTo="M 12 5 L 15 4 L 19 17 L 16 18 L 12 5 M 9 3 L 9 18 L 12 18 L 12 3 L 9 3 M 5 5 L 5 18 L 8 18 L 8 5 L 5 5 M 3 19 L 21 19 L 21 21 L 3 21 L 3 19 L 3 19"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</aapt:attr>
</target>
</animated-vector>

View File

@@ -0,0 +1,105 @@
<?xml version="1.0" encoding="utf-8"?>
<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="browse_enter"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="main_parent"
android:pivotX="12"
android:pivotY="12">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="dot"
android:fillColor="#000000"
android:pathData="M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
</group>
<clip-path
android:name="dot_mask"
android:pathData="M 0.188 0.188 L 0.188 24 L 23.938 24 L 23.938 0.188 L 0.188 0.188 Z M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
<path
android:name="compass"
android:fillColor="#000000"
android:pathData="M 6.5 17.5 L 14.01 14.01 L 17.5 6.5 L 9.99 9.99 L 6.5 17.5 Z M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
<group
android:name="ring_parent"
android:pivotX="12"
android:pivotY="12"
android:scaleX="0.833"
android:scaleY="0.833">
<path
android:name="ring"
android:fillColor="#000000"
android:pathData="M 12 0 C 8.819 0 5.765 1.265 3.515 3.515 C 1.265 5.765 0 8.819 0 12 C 0 15.181 1.265 18.235 3.515 20.485 C 5.765 22.735 8.819 24 12 24 C 15.181 24 18.235 22.735 20.485 20.485 C 22.735 18.235 24 15.181 24 12 C 24 8.819 22.735 5.765 20.485 3.515 C 18.235 1.265 15.181 0 12 0 Z M 12 21.6 C 9.455 21.6 7.012 20.588 5.212 18.788 C 3.412 16.988 2.4 14.545 2.4 12 C 2.4 9.455 3.412 7.012 5.212 5.212 C 7.012 3.412 9.455 2.4 12 2.4 C 14.545 2.4 16.988 3.412 18.788 5.212 C 20.588 7.012 21.6 9.455 21.6 12 C 21.6 14.545 20.588 16.988 18.788 18.788 C 16.988 20.588 14.545 21.6 12 21.6 Z"
android:strokeAlpha="0" />
</group>
<group android:name="group_1" />
</group>
</vector>
</aapt:attr>
<target android:name="compass">
<aapt:attr name="android:animation">
<objectAnimator
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="pathData"
android:valueFrom="M 9.99 9.99 C 9.408 11.242 8.827 12.493 8.245 13.745 C 7.663 14.997 7.082 16.248 6.5 17.5 C 6.5 17.5 6.5 17.5 6.5 17.5 C 9.003 16.337 11.507 15.173 14.01 14.01 C 15.173 11.507 16.337 9.003 17.5 6.5 C 14.997 7.663 12.493 8.827 9.99 9.99 M 12 10.9 C 11.39 10.9 10.9 11.39 10.9 12 C 10.9 12.305 11.023 12.58 11.221 12.779 C 11.42 12.977 11.695 13.1 12 13.1 C 12.61 13.1 13.1 12.61 13.1 12 C 13.1 11.39 12.61 10.9 12 10.9 L 12 10.9 M 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12 M 12 12 L 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12"
android:valueTo="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.141 5.886 21.38 10.878 21.938 C 11.247 21.979 11.621 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 C 12 2 12 2 12 2 M 12 10.9 C 11.695 10.9 11.42 11.023 11.221 11.221 C 11.023 11.42 10.9 11.695 10.9 12 C 10.9 12.61 11.39 13.1 12 13.1 C 12.61 13.1 13.1 12.61 13.1 12 C 13.1 11.39 12.61 10.9 12 10.9 L 12 10.9 M 14.19 14.19 L 6 18 L 6 18 L 9.81 9.81 L 18 6 L 14.19 14.19 L 14.19 14.19 M 12 12 L 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12 C 12 12 12 12 12 12"
android:valueType="pathType" />
</aapt:attr>
</target>
<target android:name="main_parent">
<aapt:attr name="android:animation">
<objectAnimator
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="rotation"
android:valueFrom="0"
android:valueTo="180"
android:valueType="floatType" />
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:duration="66"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="scaleX"
android:valueFrom="0"
android:valueTo="0"
android:valueType="floatType" />
<objectAnimator
android:duration="100"
android:interpolator="@android:anim/decelerate_interpolator"
android:propertyName="scaleX"
android:startOffset="66"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType" />
<objectAnimator
android:duration="66"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="scaleY"
android:valueFrom="0"
android:valueTo="0"
android:valueType="floatType" />
<objectAnimator
android:duration="100"
android:interpolator="@android:anim/decelerate_interpolator"
android:propertyName="scaleY"
android:startOffset="66"
android:valueFrom="0"
android:valueTo="1"
android:valueType="floatType" />
</set>
</aapt:attr>
</target>
</animated-vector>

View File

@@ -0,0 +1,104 @@
<?xml version="1.0" encoding="utf-8"?>
<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="browse_leave"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<group
android:name="main_parent"
android:pivotX="12"
android:pivotY="12">
<group
android:name="group"
android:pivotX="12"
android:pivotY="12">
<path
android:name="dot"
android:fillColor="#000000"
android:pathData="M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
</group>
<clip-path
android:name="dot_mask"
android:pathData="M 0.188 0.188 L 0.188 24 L 23.938 24 L 23.938 0.188 L 0.188 0.188 Z M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
<path
android:name="compass"
android:fillColor="#000000"
android:pathData="M 6.5 17.5 L 14.01 14.01 L 17.5 6.5 L 9.99 9.99 L 6.5 17.5 Z M 12 10.9 C 12.61 10.9 13.1 11.39 13.1 12 C 13.1 12.61 12.61 13.1 12 13.1 C 11.39 13.1 10.9 12.61 10.9 12 C 10.9 11.39 11.39 10.9 12 10.9 Z" />
<group
android:name="ring_parent"
android:pivotX="12"
android:pivotY="12"
android:scaleX="0.833"
android:scaleY="0.833">
<path
android:name="ring"
android:fillColor="#000000"
android:pathData="M 12 0 C 8.819 0 5.765 1.265 3.515 3.515 C 1.265 5.765 0 8.819 0 12 C 0 15.181 1.265 18.235 3.515 20.485 C 5.765 22.735 8.819 24 12 24 C 15.181 24 18.235 22.735 20.485 20.485 C 22.735 18.235 24 15.181 24 12 C 24 8.819 22.735 5.765 20.485 3.515 C 18.235 1.265 15.181 0 12 0 Z M 12 21.6 C 9.455 21.6 7.012 20.588 5.212 18.788 C 3.412 16.988 2.4 14.545 2.4 12 C 2.4 9.455 3.412 7.012 5.212 5.212 C 7.012 3.412 9.455 2.4 12 2.4 C 14.545 2.4 16.988 3.412 18.788 5.212 C 20.588 7.012 21.6 9.455 21.6 12 C 21.6 14.545 20.588 16.988 18.788 18.788 C 16.988 20.588 14.545 21.6 12 21.6 Z"
android:strokeAlpha="0" />
</group>
</group>
</vector>
</aapt:attr>
<target android:name="compass">
<aapt:attr name="android:animation">
<objectAnimator
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="pathData"
android:valueFrom="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.141 5.886 21.38 10.878 21.938 C 11.247 21.979 11.621 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 L 12 2 M 12 10.9 C 11.695 10.9 11.42 11.023 11.221 11.221 C 11.023 11.42 10.9 11.695 10.9 12 C 10.9 12.61 11.39 13.1 12 13.1 C 12.61 13.1 13.1 12.61 13.1 12 C 13.1 11.39 12.61 10.9 12 10.9 L 12 10.9 M 14.19 14.19 L 6 18 L 6 18 L 9.81 9.81 L 18 6 L 14.19 14.19 L 14.19 14.19 M 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12"
android:valueTo="M 9.99 9.99 C 9.408 11.242 8.827 12.493 8.245 13.745 C 7.663 14.997 7.082 16.248 6.5 17.5 C 6.5 17.5 6.5 17.5 6.5 17.5 C 9.003 16.337 11.507 15.173 14.01 14.01 C 15.173 11.507 16.337 9.003 17.5 6.5 L 9.99 9.99 M 12 10.9 C 11.39 10.9 10.9 11.39 10.9 12 C 10.9 12.305 11.023 12.58 11.221 12.779 C 11.42 12.977 11.695 13.1 12 13.1 C 12.61 13.1 13.1 12.61 13.1 12 C 13.1 11.39 12.61 10.9 12 10.9 L 12 10.9 M 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12 M 12 12 L 12 12 L 12 12 L 12 12 L 12 12 L 12 12"
android:valueType="pathType" />
</aapt:attr>
</target>
<target android:name="main_parent">
<aapt:attr name="android:animation">
<objectAnimator
android:duration="300"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="rotation"
android:valueFrom="180"
android:valueTo="0"
android:valueType="floatType" />
</aapt:attr>
</target>
<target android:name="group">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:duration="66"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="scaleX"
android:valueFrom="1"
android:valueTo="1"
android:valueType="floatType" />
<objectAnimator
android:duration="100"
android:interpolator="@android:anim/decelerate_interpolator"
android:propertyName="scaleX"
android:startOffset="66"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType" />
<objectAnimator
android:duration="66"
android:interpolator="@android:interpolator/fast_out_slow_in"
android:propertyName="scaleY"
android:valueFrom="1"
android:valueTo="1"
android:valueType="floatType" />
<objectAnimator
android:duration="100"
android:interpolator="@android:anim/decelerate_interpolator"
android:propertyName="scaleY"
android:startOffset="66"
android:valueFrom="1"
android:valueTo="0"
android:valueType="floatType" />
</set>
</aapt:attr>
</target>
</animated-vector>

View File

@@ -0,0 +1,18 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="#FF000000"
android:pathData="M5,5h3v13h-3z"/>
<path
android:fillColor="#FF000000"
android:pathData="M9,3h3v15h-3z"/>
<path
android:fillColor="#FF000000"
android:pathData="M3,19h18v2h-18z"/>
<path
android:fillColor="#FF000000"
android:pathData="M16,4.4h3.2v13.6h-3.2z"/>
</vector>

View File

@@ -0,0 +1,12 @@
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:autoMirrored="true"
android:tint="#000000"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M9 3V18H12V3H9M12 5L16 18L19 17L15 4L12 5M5 5V18H8V5H5M3 19V21H21V19H3Z" />
</vector>

View File

@@ -0,0 +1,24 @@
<?xml version="1.0" encoding="utf-8"?>
<animated-selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/normal"
android:drawable="@drawable/ic_bookshelf_normal"
android:state_checked="false" />
<item
android:id="@+id/checked"
android:drawable="@drawable/ic_bookshelf_checked"
android:state_checked="true" />
<transition
android:drawable="@drawable/avd_bookshelf_enter"
android:fromId="@id/normal"
android:toId="@id/checked" />
<transition
android:drawable="@drawable/avd_bookshelf_leave"
android:fromId="@id/checked"
android:toId="@id/normal" />
</animated-selector>

View File

@@ -1,5 +0,0 @@
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM6.5,17.5l7.51,-3.49L17.5,6.5 9.99,9.99 6.5,17.5zM12,10.9c0.61,0 1.1,0.49 1.1,1.1s-0.49,1.1 -1.1,1.1 -1.1,-0.49 -1.1,-1.1 0.49,-1.1 1.1,-1.1z"/>
</vector>

View File

@@ -0,0 +1,11 @@
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:tint="#000000"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M12,10.9c-0.61,0 -1.1,0.49 -1.1,1.1s0.49,1.1 1.1,1.1c0.61,0 1.1,-0.49 1.1,-1.1s-0.49,-1.1 -1.1,-1.1zM12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM14.19,14.19L6,18l3.81,-8.19L18,6l-3.81,8.19z" />
</vector>

View File

@@ -0,0 +1,11 @@
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:tint="#000000"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M12,2C6.48,2 2,6.48 2,12s4.48,10 10,10 10,-4.48 10,-10S17.52,2 12,2zM12,20c-4.41,0 -8,-3.59 -8,-8s3.59,-8 8,-8 8,3.59 8,8 -3.59,8 -8,8zM6.5,17.5l7.51,-3.49L17.5,6.5 9.99,9.99 6.5,17.5zM12,10.9c0.61,0 1.1,0.49 1.1,1.1s-0.49,1.1 -1.1,1.1 -1.1,-0.49 -1.1,-1.1 0.49,-1.1 1.1,-1.1z" />
</vector>

View File

@@ -0,0 +1,24 @@
<?xml version="1.0" encoding="utf-8"?>
<animated-selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/normal"
android:drawable="@drawable/ic_explore_normal"
android:state_checked="false" />
<item
android:id="@+id/checked"
android:drawable="@drawable/ic_explore_checked"
android:state_checked="true" />
<transition
android:drawable="@drawable/avd_explore_enter"
android:fromId="@id/normal"
android:toId="@id/checked" />
<transition
android:drawable="@drawable/avd_explore_leave"
android:fromId="@id/checked"
android:toId="@id/normal" />
</animated-selector>

View File

@@ -0,0 +1,11 @@
<vector
xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:tint="#000000"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:fillColor="@android:color/white"
android:pathData="M22.61,19L13.53,9.91C14.46,7.57 14,4.81 12.09,2.91C9.79,0.61 6.21,0.4 3.66,2.26L7.5,6.11L6.08,7.5L2.25,3.69C0.39,6.23 0.6,9.82 2.9,12.11C4.76,13.97 7.47,14.46 9.79,13.59L18.9,22.7C19.29,23.09 19.92,23.09 20.31,22.7L22.61,20.4C23,20 23,19.39 22.61,19M19.61,20.59L10.15,11.13C9.54,11.58 8.86,11.85 8.15,11.95C6.79,12.15 5.36,11.74 4.32,10.7C3.37,9.76 2.93,8.5 3,7.26L6.09,10.35L10.33,6.11L7.24,3C8.5,2.95 9.73,3.39 10.68,4.33C11.76,5.41 12.17,6.9 11.92,8.29C11.8,9 11.5,9.66 11.04,10.25L20.5,19.7L19.61,20.59Z" />
</vector>

View File

@@ -2,6 +2,6 @@
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="?attr/colorSecondaryContainer" />
<solid android:color="@color/toolbar_background_scrim" />
<corners android:radius="100dp" />
</shape>