首页 > 解决方案 > 如何添加动画矢量可绘制动画?

问题描述

我正在尝试将矢量路径动画到我的 android 应用程序中的不同路径以进行测试,但它无法正常工作。屏幕上不显示动画,也不显示任何动画。

我的矢量文件是:

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="8dp"
    android:height="5dp"
    android:viewportWidth="8"
    android:viewportHeight="5">
  <path
      android:name="redot"
      android:pathData="M2.5,2.5L6,2.5"
      android:strokeWidth="4"
      android:fillColor="#00000000"
      android:strokeColor="#E61B1B"
      android:fillType="evenOdd"
      android:strokeLineCap="round"/>
</vector>

我的 VectorAnimation 文件是:

    <?xml version="1.0" encoding="utf-8"?>
    <animated-vector xmlns:tools="http://schemas.android.com/tools"
        xmlns:android="http://schemas.android.com/apk/res/android"
        tools:targetApi="lollipop"
        android:drawable="@drawable/ic_reddot">


        <target
            android:animation="@anim/redanim"
            android:name="redot"/>

    </animated-vector>

我在 anim 文件夹中的动画文件是:

<?xml version="1.0" encoding="utf-8"?>

    <set xmlns:android="http://schemas.android.com/apk/res/android">

        <objectAnimator
            android:duration="10000"
            android:propertyName="pathData"
            android:valueFrom="M2.5,2.5L6,2.5"
            android:valueTo="M2.5,2.5L31,2.5"
            android:valueType="pathType" />

    </set>

最后我的 MainActivityCode 如下:

    public class MainActivity extends AppCompatActivity {
    private TextView testObj;
    private ImageView reddot;
    private AnimatedVectorDrawable animation;

    @RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
      // testObj = (TextView) findViewById(R.id.testObj);
     // testObj.setVisibility(View.INVISIBLE);
    reddot = (ImageView) findViewById(R.id.reddot);

               Drawable d =  reddot.getBackground();
            if (d instanceof AnimatedVectorDrawable) {
                Log.d("testanim", "onCreate: instancefound" );
                animation = (AnimatedVectorDrawable) d;
                animation.start();
            }

        }
    }

标签: androidandroid-vectordrawableanimatedvectordrawable

解决方案


使用Shape Shifter工具,然后导出由 shape shifter 生成的动画矢量可绘制文件。将此文件添加到您的可绘制文件夹中,然后将其作为背景添加到您想要动画的图像视图中

我的avd_anim.xml文件:

<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="80dp"
        android:height="12dp"
        android:viewportWidth="80"
        android:viewportHeight="12">
        <path
            android:name="path"
            android:pathData="M 6 6 L 74 6"
            android:strokeColor="#e61b1b"
            android:strokeWidth="12"
            android:strokeLineCap="round"
            android:fillType="evenOdd"/>
    </vector>
</aapt:attr>
<target android:name="path">
    <aapt:attr name="android:animation">
        <objectAnimator
            android:propertyName="pathData"
            android:duration="1000"
            android:valueFrom="M 6 6 L 74 6"
            android:valueTo="M 6 6 L 1 6"
            android:valueType="pathType"
            android:interpolator="@android:anim/linear_interpolator"/>
    </aapt:attr>
</target>

我的activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

   <ImageView
       android:id="@+id/object"
       android:layout_width="wrap_content"
       android:layout_height="wrap_content"
       android:layout_marginStart="8dp"
       android:layout_marginTop="8dp"
       android:layout_marginEnd="8dp"
       android:layout_marginBottom="8dp"
       android:src="@drawable/avd_anim"
       app:layout_constraintBottom_toBottomOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

最后是我的MainActivity.class

public class MainActivity extends AppCompatActivity {
private ImageView image;
private AnimatedVectorDrawable animation;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        image = (ImageView) findViewById(R.id.object);
    }

    @Override
    protected void onStart() {
        super.onStart();
        Drawable d = image.getDrawable();
        if (d instanceof AnimatedVectorDrawable) {
            Log.d("testanim", "onCreate: instancefound" + d.toString());
            animation = (AnimatedVectorDrawable) d;
            animation.start();
        }
    }

}

推荐阅读