Skip to content

Instantly share code, notes, and snippets.

@miloszwasacz
Created May 14, 2022 13:19
Show Gist options
  • Save miloszwasacz/4a16e034a61a95a9392b1f872a7a1313 to your computer and use it in GitHub Desktop.
Save miloszwasacz/4a16e034a61a95a9392b1f872a7a1313 to your computer and use it in GitHub Desktop.
VectorAnimatedDrawable Round Checkbox
<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"
android:tint="?attr/colorControlNormal">
<path
android:name="path"
android:pathData="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 12 20 C 7.59 20 4 16.41 4 12 C 4 7.59 7.59 4 12 4 C 16.41 4 20 7.59 20 12 C 20 16.41 16.41 20 12 20 Z M 15.88 8.29 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 L 17.3 9.7 C 17.69 9.31 17.69 8.68 17.3 8.29 C 16.91 7.9 16.27 7.9 15.88 8.29 Z"
android:fillColor="@android:color/white"
android:fillType="evenOdd"/>
</vector>
</aapt:attr>
<target android:name="path">
<aapt:attr name="android:animation">
<set>
<objectAnimator
android:propertyName="pathData"
android:duration="40"
android:valueFrom="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 8.12 12.29 C 8.12 12.29 7.805 12.605 7.415 12.995 C 7.025 13.385 6.71 13.7 6.71 13.7 C 6.71 13.7 6.71 13.7 6.71 13.7 C 6.71 13.7 6.745 13.665 6.806 13.604 C 6.867 13.543 6.954 13.456 7.059 13.351 C 7.163 13.247 7.285 13.125 7.415 12.995 L 8.12 12.29 L 8.12 12.29 L 8.12 12.29 M 12 20 C 16.41 20 20 16.41 20 12 C 20 7.59 16.41 4 12 4 C 7.59 4 4 7.59 4 12 C 4 16.41 7.59 20 12 20 L 12 20"
android:valueTo="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 8.12 12.29 C 8.12 12.29 8.12 12.29 8.12 12.29 C 7.885 12.525 7.65 12.76 7.415 12.995 C 7.18 13.23 6.945 13.465 6.71 13.7 C 6.71 13.7 6.71 13.7 6.71 13.7 C 6.945 13.465 7.18 13.23 7.415 12.995 C 7.65 12.76 7.885 12.525 8.12 12.29 L 8.12 12.29 L 8.12 12.29 L 8.12 12.29 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 L 12 12"
android:valueType="pathType"
android:interpolator="@android:anim/linear_interpolator"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="40"
android:duration="50"
android:valueFrom="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 8.12 12.29 L 8.12 12.29 L 8.12 12.29 C 7.885 12.525 7.65 12.76 7.415 12.995 C 7.18 13.23 6.945 13.465 6.71 13.7 L 6.71 13.7 C 6.945 13.465 7.18 13.23 7.415 12.995 C 7.65 12.76 7.885 12.525 8.12 12.29 C 8.12 12.29 8.12 12.29 8.12 12.29 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 Z"
android:valueTo="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 10 14.17 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 C 11.019 15.981 11.028 15.687 11.028 15.687 C 11.028 15.687 11.104 15.274 10.71 14.88 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 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="100"
android:duration="100"
android:valueFrom="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 10 14.17 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 L 11.415 15.585 C 11.415 15.585 11.1 15.27 10.71 14.88 C 10.32 14.49 10 14.17 10 14.17 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 Z"
android:valueTo="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 15.88 8.29 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 L 17.3 9.7 C 17.69 9.31 17.69 8.68 17.3 8.29 C 16.91 7.9 16.27 7.9 15.88 8.29 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 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
<objectAnimator
android:propertyName="pathData"
android:startOffset="90"
android:duration="10"
android:valueFrom="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 10 14.17 L 10 14.17 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 C 11.019 15.981 11.028 15.687 11.028 15.687 C 11.028 15.687 11.104 15.274 10.71 14.88 C 10.473 14.643 10.237 14.407 10 14.17 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 Z"
android:valueTo="M 12 2 C 6.48 2 2 6.48 2 12 C 2 17.52 6.48 22 12 22 C 17.52 22 22 17.52 22 12 C 22 6.48 17.52 2 12 2 Z M 10 14.17 L 10 14.17 L 10 14.17 L 8.12 12.29 C 7.73 11.9 7.1 11.9 6.71 12.29 C 6.32 12.68 6.32 13.31 6.71 13.7 L 9.3 16.29 C 9.69 16.68 10.32 16.68 10.71 16.29 C 10.945 16.055 11.18 15.82 11.415 15.585 C 11.415 15.585 11.1 15.27 10.71 14.88 C 10.32 14.49 10 14.17 10 14.17 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 Z"
android:valueType="pathType"
android:interpolator="@android:interpolator/fast_out_slow_in"/>
</set>
</aapt:attr>
</target>
</animated-vector>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment