vector动画

本文介绍了如何在Android中创建和使用animated_vector.xml来实现矢量图的动画效果。通过在drawable下定义动画目标和属性,然后在animator文件中设置动画细节,如translateX的平移动画,实现两个矢量图元素左右移动的无限循环效果。在activity_main.xml中设置ImageView加载该动画,并在Activity中监听点击事件启动动画。在构建过程中,需要在build.gradle中配置vectorDrawables.useSupportLibrary为true。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

drawable 下创建animated_vector.xml

<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:drawable="@drawable/vector_drawable"
    tools:ignore="NewApi">
    <target
        android:name="left"
        android:animation="@animator/anim1"/>
    <target
        android:name="right"
        android:animation="@animator/anim2"/>
</animated-vector>

animator下,anim1.xml

<objectAnimator
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:propertyName="translateX"
    android:repeatMode="reverse"
    android:repeatCount="infinite"
    android:valueType="floatType"
    android:valueFrom="0"
    android:valueTo="10">


</objectAnimator>

anim2.xml

<objectAnimator
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:propertyName="translateX"
    android:repeatMode="reverse"
    android:repeatCount="infinite"
    android:valueType="floatType"
    android:valueFrom="0"
    android:valueTo="-10">


</objectAnimator>
vector_drawable.xml
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
    <group
        android:name="left">
        <path
            android:fillColor="#FF000000"
            android:pathData="M6.99,11L3,15l3.99,4v-3H14v-2H6.99v-3z,"/>
    </group>

    <group
        android:name="right">
        <path
            android:fillColor="#FF000000"
            android:pathData="M21,9l-3.99,-4v3H10v2h7.01v3L21,9z"/>
    </group>
</vector>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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/iv_demo"
        android:layout_width="80dp"
        android:layout_height="80dp"
        app:srcCompat="@drawable/animated_vector"
        tools:ignore="MissingConstraints" />

</androidx.constraintlayout.widget.ConstraintLayout>

Activity中的用法



public class MainActivity extends AppCompatActivity {
    static{
        AppCompatDelegate.setCompatVectorFromResourcesEnabled(true);
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        findViewById(R.id.iv_demo).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                ImageView view = (ImageView)v;
                Drawable drawable =  view.getDrawable();
                if(drawable instanceof Animatable){

                    ((Animatable) drawable).start();
                }

            }
        });
    }
}

activity

build.gradle中添加

defaultConfig {

    vectorDrawables.useSupportLibrary = true
}
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值