Android圈子复选标记动画

概述我正在尝试实现类似于BEMAnimationTypeStroke的东西,它可以在iOS库BEMCheckBox中找到.我已经尝试使用动画矢量drawable来实现这一点,但我不知道如何设置圆圈内的复选标记从0起点到最终位置的动画.(圆圈可以是静态的,我希望为复选标记设置动画).这是我为此尝试的实现：绘制/vector

我正在尝试实现类似于BEMAnimationTypestroke的东西,它可以在iOS库BEMCheckBox中找到.

我已经尝试使用动画矢量drawable来实现这一点,但我不知道如何设置圆圈内的复选标记从0起点到最终位置的动画. (圆圈可以是静态的,我希望为复选标记设置动画).
这是我为此尝试的实现：

绘制/ vector_drawable_ic_check_circle_white_48px.xml
    
    

    <path            androID:name="check"            androID:fillcolor="#FFFFFF"            androID:pathData="M37.1,13.6L18.4,32.3h1.7l-8.5-8.5L10,25.5l8.5,8.5l0.8,0.8l0.8-0.8l18.7-18.7L37.1,13.6L37.1,13.6z"/>    <path            androID:name="circle"            androID:fillcolor="#FFFFFF"            androID:pathData="M24,48c13.3,0,24-10.7,24-24S37.3,0,24,0S0,10.7,0,24S10.7,48,24,48L24,48zM24,45.6C12.1,45.6,2.4,35.9,2.4,24S12.1,2.4,24,2.4S45.6,12.1,45.6,24S35.9,45.6,24,45.6L24,45.6z"/></vector>

动画/ transform.xml

<?xml version="1.0" enCoding="utf-8"?><set xmlns:androID="http://schemas.androID.com/apk/res/androID">    <objectAnimator            androID:duration="1000"            androID:propertyname="fillcolor"            androID:valueFrom="@color/transparent"            androID:valueto="@color/white"/></set>

绘制/ animation.xml

<?xml version="1.0" enCoding="utf-8"?><animated-vector xmlns:androID="http://schemas.androID.com/apk/res/androID"        androID:drawable="@drawable/vector_drawable_ic_check_circle_white_48px">    <target            androID:name="check"            androID:animation="@anim/change_color"/></animated-vector>

设置布局后,我使用以下命令启动动画：

ImageVIEw mcpuImageVIEw = (ImageVIEw) findVIEwByID(R.ID.animated_check);Drawable drawable = mcpuImageVIEw.getDrawable();if (drawable instanceof Animatable) {    ((Animatable) drawable).start();}

谁能帮我这个？有没有更简单的方法来实现这一点(自定义视图或现有库)？

我的想法是,我希望在一个圆圈中有一个复选标记,我想要勾选复选标记的路径.显示时,只显示圆圈,然后创建复选标记动画.如果其他自定义,例如同时为复选标记设置动画的动画,则很容易实现它会更好,但起初我只想为复选标记设置动画.

LE：
最后,我选择了通过自定义视图手动创建动画的方法.如果有人知道如何通过矢量绘制实现这一点,它将是一个很好的开发实践.谢谢.

解决方法:

我一直在寻找相同的东西,这个post几乎解释了这一切.该帖子的代码：

绘制/ check_mark.xml

<vector xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:wIDth="24dp"    androID:height="24dp"    androID:vIEwportHeight="24.0"    androID:vIEwportWIDth="24.0">    <group androID:name="background">        <path            androID:name="circle"            androID:fillcolor="@color/colorPrimary"            androID:pathData="M12,12m-10,0a10,10 0,1 1,20 0a10,10 0,1 1,-20 0" />    </group>    <group androID:name="check">        <path            androID:name="tick"            androID:pathData="M6,11 l0,0 l0,0"            androID:strokecolor="@color/colorAccent"            androID:strokeWIDth="1" />    </group></vector>

可绘制-V21 / animated_check.xml

<?xml version="1.0" enCoding="utf-8"?><animated-vector xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:drawable="@drawable/check_mark">    <target        androID:name="tick"        androID:animation="@anim/check_animation" /></animated-vector>

动画/ check_animation.xml

<?xml version="1.0" enCoding="utf-8"?><set xmlns:androID="http://schemas.androID.com/apk/res/androID"    androID:interpolator="@androID:anim/accelerate_interpolator"    androID:ordering="sequentially"    androID:shareInterpolator="false">    <!-- Step 1 -->    <objectAnimator        androID:duration="@androID:integer/config_shortAnimTime"        androID:propertyname="pathData"        androID:valueFrom="M6,11 l0,0 l0,0"        androID:valueto="M6,11 l3.5,4 l0,0"        androID:valueType="pathType" />    <!-- Step 2 -->    <objectAnimator        androID:duration="@androID:integer/config_shortAnimTime"        androID:propertyname="pathData"        androID:valueFrom="M6,11 l3.5,4 l0,0"        androID:valueto="M6,11 l3.5,4 l8,-7"        androID:valueType="pathType" /></set>

用法

布局XML

<ImageVIEw    androID:ID="@+ID/imageVIEw"    androID:layout_wIDth="100dp"    androID:layout_height="100dp"    androID:visibility="visible"    app:srcCompat="@drawable/animated_check" />

java类

mimgCheck = (ImageVIEw) findVIEwByID(R.ID.imageVIEw);((Animatable) mimgCheck.getDrawable()).start();

总结

以上是内存溢出为你收集整理的Android圈子复选标记动画全部内容，希望文章能够帮你解决Android圈子复选标记动画所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。