mirror of
https://github.com/tachiyomiorg/tachiyomi.git
synced 2024-12-24 01:51:48 +01:00
Animated browse tab icon
This commit is contained in:
Jays2Kings
parent
f664a4cf9b
commit
5b6463c823
55
app/src/main/res/drawable/anim_browse_filled_to_outline.xml
Normal file
55
app/src/main/res/drawable/anim_browse_filled_to_outline.xml
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
<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"
|
||||||
|
android:pivotX="12"
|
||||||
|
android:pivotY="12">
|
||||||
|
<clip-path
|
||||||
|
android:name="mask"
|
||||||
|
android:pathData="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.572 2.515 13.963 2.058 12.319 2.005 C 12.213 2.002 12.106 2 12 2 M 12 10.9 C 11.708 10.9 11.428 11.016 11.222 11.222 C 11.016 11.428 10.9 11.708 10.9 12 C 10.9 12.292 11.016 12.572 11.222 12.778 C 11.428 12.984 11.708 13.1 12 13.1 C 12.292 13.1 12.572 12.984 12.778 12.778 C 12.984 12.572 13.1 12.292 13.1 12 C 13.1 11.708 12.984 11.428 12.778 11.222 C 12.572 11.016 12.292 10.9 12 10.9 C 12 10.9 12 10.9 12 10.9 M 14.19 14.19 L 6 18 L 9.81 9.81 L 18 6"/>
|
||||||
|
<path
|
||||||
|
android:name="path"
|
||||||
|
android:pathData="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z M 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 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:fillColor="#000"
|
||||||
|
android:strokeWidth="1"/>
|
||||||
|
<path
|
||||||
|
android:name="path_2"
|
||||||
|
android:pathData="M 7 17 L 10.2 10.2 L 17 7 L 13.8 13.8 L 7 17 M 12 11.1 C 11.5 11.1 11.1 11.5 11.1 12 C 11.1 12.5 11.5 12.9 12 12.9 C 12.5 12.9 12.9 12.5 12.9 12 C 12.9 11.5 12.5 11.1 12 11.1"
|
||||||
|
android:fillColor="#000"
|
||||||
|
android:strokeWidth="1"/>
|
||||||
|
</group>
|
||||||
|
</vector>
|
||||||
|
</aapt:attr>
|
||||||
|
<target android:name="path">
|
||||||
|
<aapt:attr name="android:animation">
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="pathData"
|
||||||
|
android:startOffset="75"
|
||||||
|
android:duration="300"
|
||||||
|
android:valueFrom="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z M 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 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 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z M 12 20 C 9.879 20 7.843 19.157 6.343 17.657 C 4.843 16.157 4 14.121 4 12 C 4 9.879 4.843 7.843 6.343 6.343 C 7.843 4.843 9.879 4 12 4 C 14.121 4 16.157 4.843 17.657 6.343 C 19.157 7.843 20 9.879 20 12 C 20 14.121 19.157 16.157 17.657 17.657 C 16.157 19.157 14.121 20 12 20"
|
||||||
|
android:valueType="pathType"
|
||||||
|
android:interpolator="@android:interpolator/fast_out_slow_in"/>
|
||||||
|
</aapt:attr>
|
||||||
|
</target>
|
||||||
|
<target android:name="mask">
|
||||||
|
<aapt:attr name="android:animation">
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="pathData"
|
||||||
|
android:startOffset="75"
|
||||||
|
android:duration="300"
|
||||||
|
android:valueFrom="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.572 2.515 13.963 2.058 12.319 2.005 C 12.213 2.002 12.106 2 12 2 M 12 10.9 C 11.708 10.9 11.428 11.016 11.222 11.222 C 11.016 11.428 10.9 11.708 10.9 12 C 10.9 12.292 11.016 12.572 11.222 12.778 C 11.428 12.984 11.708 13.1 12 13.1 C 12.292 13.1 12.572 12.984 12.778 12.778 C 12.984 12.572 13.1 12.292 13.1 12 C 13.1 11.708 12.984 11.428 12.778 11.222 C 12.572 11.016 12.292 10.9 12 10.9 C 12 10.9 12 10.9 12 10.9 M 14.19 14.19 L 6 18 L 9.81 9.81 L 18 6"
|
||||||
|
android:valueTo="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 C 12 2 12 2 12 2 M 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 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 C 12 12 12 12 12 12 M 12 12 L 12 12 L 12 12 L 12 12"
|
||||||
|
android:valueType="pathType"
|
||||||
|
android:interpolator="@android:interpolator/fast_out_slow_in"/>
|
||||||
|
</aapt:attr>
|
||||||
|
</target>
|
||||||
|
</animated-vector>
|
||||||
77
app/src/main/res/drawable/anim_browse_outline_to_filled.xml
Normal file
77
app/src/main/res/drawable/anim_browse_outline_to_filled.xml
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
<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"
|
||||||
|
android:pivotX="12"
|
||||||
|
android:pivotY="12">
|
||||||
|
<clip-path
|
||||||
|
android:name="mask"
|
||||||
|
android:pathData="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 C 12 2 12 2 12 2 M 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 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 C 12 12 12 12 12 12 M 12 12 L 12 12 L 12 12 L 12 12"/>
|
||||||
|
<path
|
||||||
|
android:name="path"
|
||||||
|
android:pathData="M 12 20 C 9.879 20 7.843 19.157 6.343 17.657 C 4.843 16.157 4 14.121 4 12 C 4 9.879 4.843 7.843 6.343 6.343 C 7.843 4.843 9.879 4 12 4 C 14.121 4 16.157 4.843 17.657 6.343 C 19.157 7.843 20 9.879 20 12 C 20 14.121 19.157 16.157 17.657 17.657 C 16.157 19.157 14.121 20 12 20 M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z"
|
||||||
|
android:fillColor="#000"
|
||||||
|
android:strokeWidth="1"/>
|
||||||
|
<path
|
||||||
|
android:name="path_2"
|
||||||
|
android:pathData="M 7 17 L 10.2 10.2 L 17 7 L 13.8 13.8 L 7 17 M 12 11.1 C 11.5 11.1 11.1 11.5 11.1 12 C 11.1 12.5 11.5 12.9 12 12.9 C 12.5 12.9 12.9 12.5 12.9 12 C 12.9 11.5 12.5 11.1 12 11.1"
|
||||||
|
android:fillColor="#000"
|
||||||
|
android:strokeWidth="1"/>
|
||||||
|
</group>
|
||||||
|
</vector>
|
||||||
|
</aapt:attr>
|
||||||
|
<target android:name="path">
|
||||||
|
<aapt:attr name="android:animation">
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="pathData"
|
||||||
|
android:startOffset="150"
|
||||||
|
android:duration="300"
|
||||||
|
android:valueFrom="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z M 12 20 C 9.879 20 7.843 19.157 6.343 17.657 C 4.843 16.157 4 14.121 4 12 C 4 9.879 4.843 7.843 6.343 6.343 C 7.843 4.843 9.879 4 12 4 C 14.121 4 16.157 4.843 17.657 6.343 C 19.157 7.843 20 9.879 20 12 C 20 14.121 19.157 16.157 17.657 17.657 C 16.157 19.157 14.121 20 12 20"
|
||||||
|
android:valueTo="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 Z M 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 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"
|
||||||
|
android:interpolator="@android:interpolator/fast_out_slow_in"/>
|
||||||
|
</aapt:attr>
|
||||||
|
</target>
|
||||||
|
<target android:name="mask">
|
||||||
|
<aapt:attr name="android:animation">
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="pathData"
|
||||||
|
android:startOffset="150"
|
||||||
|
android:duration="300"
|
||||||
|
android:valueFrom="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.48 2.462 13.755 2 12 2 C 12 2 12 2 12 2 M 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 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 C 12 12 12 12 12 12 M 12 12 L 12 12 L 12 12 L 12 12"
|
||||||
|
android:valueTo="M 12 2 C 9.349 2 6.804 3.054 4.929 4.929 C 3.054 6.804 2 9.349 2 12 C 2 14.651 3.054 17.196 4.929 19.071 C 6.804 20.946 9.349 22 12 22 C 13.755 22 15.48 21.538 17 20.66 C 18.52 19.783 19.783 18.52 20.66 17 C 21.538 15.48 22 13.755 22 12 C 22 10.245 21.538 8.52 20.66 7 C 19.783 5.48 18.52 4.217 17 3.34 C 15.572 2.515 13.963 2.058 12.319 2.005 C 12.213 2.002 12.106 2 12 2 M 12 10.9 C 11.708 10.9 11.428 11.016 11.222 11.222 C 11.016 11.428 10.9 11.708 10.9 12 C 10.9 12.292 11.016 12.572 11.222 12.778 C 11.428 12.984 11.708 13.1 12 13.1 C 12.292 13.1 12.572 12.984 12.778 12.778 C 12.984 12.572 13.1 12.292 13.1 12 C 13.1 11.708 12.984 11.428 12.778 11.222 C 12.572 11.016 12.292 10.9 12 10.9 C 12 10.9 12 10.9 12 10.9 M 14.19 14.19 L 6 18 L 9.81 9.81 L 18 6"
|
||||||
|
android:valueType="pathType"
|
||||||
|
android:interpolator="@android:interpolator/fast_out_slow_in"/>
|
||||||
|
</aapt:attr>
|
||||||
|
</target>
|
||||||
|
<target android:name="group">
|
||||||
|
<aapt:attr name="android:animation">
|
||||||
|
<set>
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="rotation"
|
||||||
|
android:startOffset="75"
|
||||||
|
android:duration="250"
|
||||||
|
android:valueFrom="0"
|
||||||
|
android:valueTo="-90"
|
||||||
|
android:valueType="floatType"
|
||||||
|
android:interpolator="@android:anim/accelerate_decelerate_interpolator"/>
|
||||||
|
<objectAnimator
|
||||||
|
android:propertyName="rotation"
|
||||||
|
android:startOffset="325"
|
||||||
|
android:duration="400"
|
||||||
|
android:valueFrom="-90"
|
||||||
|
android:valueTo="0"
|
||||||
|
android:valueType="floatType"
|
||||||
|
android:interpolator="@android:anim/anticipate_overshoot_interpolator"/>
|
||||||
|
</set>
|
||||||
|
</aapt:attr>
|
||||||
|
</target>
|
||||||
|
</animated-vector>
|
||||||
@ -1,5 +1,16 @@
|
|||||||
<?xml version="1.0" encoding="utf-8"?>
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
<selector xmlns:android="http://schemas.android.com/apk/res/android">
|
<animated-selector xmlns:android="http://schemas.android.com/apk/res/android">
|
||||||
<item android:drawable="@drawable/ic_browse_24dp" android:state_checked="true" />
|
<item android:id="@+id/checked" android:drawable="@drawable/ic_browse_24dp" android:state_checked="true" />
|
||||||
<item android:drawable="@drawable/ic_browse_outline_24dp" android:state_checked="false" />
|
<item android:id="@+id/normal" android:drawable="@drawable/ic_browse_outline_24dp" android:state_checked="false" />
|
||||||
</selector>
|
|
||||||
|
<transition
|
||||||
|
android:fromId="@id/checked"
|
||||||
|
android:toId="@id/normal"
|
||||||
|
android:drawable="@drawable/anim_browse_filled_to_outline"/>
|
||||||
|
|
||||||
|
<transition
|
||||||
|
android:fromId="@id/normal"
|
||||||
|
android:toId="@id/checked"
|
||||||
|
android:drawable="@drawable/anim_browse_outline_to_filled"/>
|
||||||
|
|
||||||
|
</animated-selector>
|
||||||
Loading…
Reference in New Issue
Block a user