【问题标题】:Is there a way to automatically animate VectorDrawable by setting start and end vectors有没有办法通过设置开始和结束向量来自动为 VectorDrawable 设置动画
【发布时间】:2016-08-22 02:03:58
【问题描述】:

AnimatedVectorDrawable

我想知道是否可以在 Android 中创建两个 vector drawables,并从第一个矢量到第二个矢量自动对其进行动画处理。

类似于ViewTransitonTransitionManager.go

【问题讨论】:

  • 答案是否定的;您需要自己构建特定的动画。我只知道一种可以实现自动化的工具:VectAlign github.com/bonnyfone/vectalign,但您会得到不同的结果。

标签: android android-studio animation vector android-vectordrawable


【解决方案1】:

您有一个可绘制矢量 (@drawable/vector.xml):

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:viewportWidth="170"
    android:viewportHeight="170"
    android:width="500dp"
    android:height="500dp">
    <path
        android:name="my_vector_path"
        android:fillColor="#FF000000"
        android:pathData="M85,40
                          c10,0 20,0 30,0
                          c0,-5 -10,-20 -30,-20
                          c-20,0 -30,15 -30,20
                          c10,0 20,0 30,0"
    />
</vector>

创建动画矢量 (@drawable/animated_vector.xml):

<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
                 android:drawable="@drawable/vector" >
    <target
        android:name="my_vector_path"
        android:animation="@anim/vector_animation"
    />
</animated-vector>

创建动画(@anim/vector_animation.xml):

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:duration="2000"
        android:propertyName="pathData"
        android:valueType="pathType"
        android:valueFrom="M85,40
                           c10,0 20,0 30,0
                           c0,-5 -10,-20 -30,-20
                           c-20,0 -30,15 -30,20
                           c10,0 20,0 30,0"
        android:valueTo="M108,35
                         c5.587379,-6.7633 9.348007,-16.178439 8.322067,-25.546439
                         c-8.053787,0.32369 -17.792625,5.36682 -23.569427,12.126399
                         c-5.177124,5.985922 -9.711121,15.566772 -8.48777,24.749359
                         c8.976891,0.69453 18.147476,-4.561718 23.73513,-11.329308"/>
</set>

动画包含矢量路径的fromto 值。

最后,在代码中,启动动画:

ImageView imageView = (ImageView) findViewById(R.id.image_view);
AnimatedVectorDrawable animatedVectorDrawable =
        (AnimatedVectorDrawable) getDrawable(R.drawable.animated_vector);
imageView.setImageDrawable(animatedVectorDrawable);
animatedVectorDrawable.start();

【讨论】:

  • 很好,但是没有 java\kotlin 代码是否有可能启动动画?仅在 xml 中?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2011-08-23
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-12-20
  • 1970-01-01
相关资源
最近更新 更多