属性动画

最新推荐文章于 2024-09-14 00:36:28 发布

原创最新推荐文章于 2024-09-14 00:36:28 发布 · 243 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#属性动画

本文介绍了一个Android应用程序中的多种动画实现方式，包括切换动画、补间动画、属性动画等，并通过具体示例展示了如何创建和控制这些动画。

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

MainActivity

package bw.com.bw_day03_animation;

import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;

import bw.com.bw_day03_animation.demo01.InfoActivity;
import bw.com.bw_day03_animation.demo02.TweenActivity;
import bw.com.bw_day03_animation.demo03.PropertyActivity01;
import bw.com.bw_day03_animation.demo04.PropertyActivity02;
import bw.com.bw_day03_animation.demo05.PropertyActivity03;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void onClick(View view) {



        switch (view.getId())
        {
            case R.id.but_01:

               Intent intent = new Intent(MainActivity.this, InfoActivity.class);
                startActivity(intent);

                //添加切换的动画  -- 补间动画  -- res/anim 文件夹
                //进入时的动画 -- InfoActivity, 退出时的动画 -- MainActivity
                overridePendingTransition(R.anim.enter_anim,R.anim.exit_anim);
                break;

            case R.id.but_02:
                startActivity(new Intent(this, TweenActivity.class));
                break;

            case R.id.but_03:
                startActivity(new Intent(this,PropertyActivity01.class));

                break;
            case  R.id.but_04:
                startActivity(new Intent(this, PropertyActivity02.class));
                break;
            case R.id.but_05:
                startActivity(new Intent(this, PropertyActivity03.class));
                break;
        }



    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="bw.com.bw_day03_animation.MainActivity">

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Activity  切换的动画"
        android:id="@+id/but_01"
        android:onClick="onClick"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Tween  动画效果"
        android:id="@+id/but_02"
        android:onClick="onClick"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="资源文件  创建属性动画"
        android:id="@+id/but_03"
        android:onClick="onClick"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="代码  创建属性动画"
        android:id="@+id/but_04"
        android:onClick="onClick"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="弧形菜单"
        android:id="@+id/but_05"
        android:onClick="onClick"
        />

</LinearLayout>

demo01

InfoActivity

package bw.com.bw_day03_animation.demo01;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import bw.com.bw_day03_animation.R;

public class InfoActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_info);
    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="bw.com.bw_day03_animation.demo01.InfoActivity">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@mipmap/tp"
        />

</LinearLayout>

demo02

TweenActivity

package bw.com.bw_day03_animation.demo02;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.Toast;

import bw.com.bw_day03_animation.R;

/**
 * 验证:  而补间动画, 更改的View 的绘制效果, 真正的属性依然保留在以前的位置上
 */
public class TweenActivity extends AppCompatActivity {

    private ImageView mIv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_tween);

        mIv = (ImageView) findViewById(R.id.iv_id);
        
        mIv.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(TweenActivity.this, "我在这里, 哈哈哈哈哈哈......", Toast.LENGTH_SHORT).show();
            }
        });
    }

    //点击按钮, 播放动画 --- 位移
    public void onClick(View view) {

        TranslateAnimation translateAnimation  = new TranslateAnimation(0,0,0,600);
        translateAnimation.setDuration(3000);
        translateAnimation.setFillAfter(true);
        mIv.startAnimation(translateAnimation);

    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="bw.com.bw_day03_animation.demo02.TweenActivity">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="播放动画"
        android:onClick="onClick"
        />
    <ImageView
        android:id="@+id/iv_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

</LinearLayout>

demo03

PropertyActivity01

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    android:gravity="center"
    tools:context="bw.com.bw_day03_animation.demo03.PropertyActivity01">


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/rocket_launch_2"
        android:id="@+id/iv_id"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="缩放X轴"
        android:id="@+id/but_01"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="缩放Y轴"
        android:id="@+id/but_02"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="旋转 X"
        android:id="@+id/but_03"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="发射"
        android:id="@+id/but_04"
        android:onClick="onClick"/>

</LinearLayout>

activity_property01

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    android:gravity="center"
    tools:context="bw.com.bw_day03_animation.demo03.PropertyActivity01">


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/rocket_launch_2"
        android:id="@+id/iv_id"
        />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="缩放X轴"
        android:id="@+id/but_01"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="缩放Y轴"
        android:id="@+id/but_02"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="旋转 X"
        android:id="@+id/but_03"
        android:onClick="onClick"/>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="发射"
        android:id="@+id/but_04"
        android:onClick="onClick"/>

</LinearLayout>

demo04

PropertyActivity02

package bw.com.bw_day03_animation.demo04;

import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;

import bw.com.bw_day03_animation.R;

/**
 * 1, 定义动画对象
 * 执行动画的控件,  动画的属性名称 , 动画的属性值 -- 可变长度的数组
 *      属性名称:
 位移:  translationX  translationY
 旋转:  rotation    rotationX   rotationY
 缩放:  scaleX      scaleY
 透明:  alpha
 *  ObjectAnimator alpha =  ObjectAnimator.ofFloat(mIv,"alpha",1.0f,0.0f,1.0f);

 * 2, 设置动画的持续时间
 *  alpha.setDuration(5000);
 *  3, 启动动画
 *  alpha.start();
 */
public class PropertyActivity02 extends AppCompatActivity {

    private ImageView mIv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_property_actitivy02);

        mIv = (ImageView) findViewById(R.id.iv_id);
        
        mIv.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(PropertyActivity02.this, "我在这里, 呵呵......", Toast.LENGTH_SHORT).show();
            }
        });
    }

    public void onClick(View view) {

        switch (view.getId())
        {
            case R.id.but_01:
                //渐变  -- 透明度
                //1, 定义动画
                //执行动画的控件,  动画的属性名称 , 动画的属性值 -- 可变长度的数组
                /**
                 * 属性名称:
                 位移:  translationX  translationY
                 旋转:  rotation    rotationX   rotationY
                 缩放:  scaleX      scaleY
                 透明:  alpha
                 */
                ObjectAnimator alpha =  ObjectAnimator.ofFloat(mIv,"alpha",1.0f,0.0f,1.0f);
                //2, 设置动画的持续时间
                alpha.setDuration(5000);
                //3, 启动动画
                alpha.start();

                break;
            case R.id.but_02:
                //缩放X
                //1, 定义动画
                ObjectAnimator scaleX = ObjectAnimator.ofFloat(mIv,"scaleX",1,3,1,3,1,3);
                //2, 设置动画的持续时间
                scaleX.setDuration(5000);
                //3, 启动动画
                scaleX.start();

                break;
            case R.id.but_03:
                //旋转
                //1, 创建动画
                ObjectAnimator rotation = ObjectAnimator.ofFloat(mIv,"rotation",0,360);
                //2, 设置动画的持续时间
                rotation.setDuration(5000);
                //3, 启动动画
                rotation.start();
                break;
            case R.id.but_04:
                //移动Y
                //1, 创建动画
                ObjectAnimator translationY = ObjectAnimator.ofFloat(mIv,"translationY",0,900,500,800,700);
                //2, 设置动画的持续时间
                translationY.setDuration(5000);
                //3, 启动动画
                translationY.start();
                break;
            case R.id.but_05:
                //集合
                //1, 创建集合对象
                AnimatorSet animatorSet = new AnimatorSet();

                //2, 创建每一个动画
                ObjectAnimator rotationAnimator = ObjectAnimator.ofFloat(mIv,"rotation",0,360);
                ObjectAnimator translationYAnimator = ObjectAnimator.ofFloat(mIv,"translationY",0,900);

                //3, 把单个动画添加到集合中
                //第一种方式
//                    List<Animator> list = new ArrayList<>();
//                    list.add(rotationAnimator);
//                    list.add(translationYAnimator);
//                    //animatorSet.playSequentially(list);//依次执行
//                    animatorSet.playTogether(list);//一起执行

                //第二种方式  -- 注意:  同一个动画, 只能被使用一次
                    animatorSet.play(rotationAnimator).with(translationYAnimator);

                //4, 设置持续时间
                animatorSet.setDuration(5000);

                //5, 启动动画
                animatorSet.start();
                break;

        }
    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context="bw.com.bw_day03_animation.demo04.PropertyActivity02">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="渐变"
            android:id="@+id/but_01"
            android:onClick="onClick"/>

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="缩放X"
            android:id="@+id/but_02"
            android:onClick="onClick"/>


        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="旋转"
            android:id="@+id/but_03"
            android:onClick="onClick"/>


        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="移动Y"
            android:id="@+id/but_04"
            android:onClick="onClick"/>


        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="集合"
            android:id="@+id/but_05"
            android:onClick="onClick"/>

    </LinearLayout>

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"
        android:id="@+id/iv_id"
        android:layout_gravity="center"
        />

</LinearLayout>

demo05

PropertyActivity03

package bw.com.bw_day03_animation.demo05;

import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

import bw.com.bw_day03_animation.R;

public class PropertyActivity03 extends AppCompatActivity  implements View.OnClickListener{

    //所有的控件id
    private int[] ids = {R.id.img_a,R.id.img_b,R.id.img_c,R.id.img_d,R.id.img_e};
    private List<ImageView> views = new ArrayList<>();

    private boolean flag = true;// true : 当前点击按键, 弹出菜单 ;  false 当前点击按钮, 合并菜单


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_property03);

        //初始化控件
        for(int i=0;i<ids.length;i++)
        {
            ImageView iv = (ImageView) findViewById(ids[i]);
            iv.setOnClickListener(this);//为每个图片设置监听器
            views.add(iv);
        }
    }

    @Override
    public void onClick(View v) {

        switch (v.getId())
        {
            case R.id.img_a:
                if(flag)
                {
                    //打开菜单
                    startAnim();
                }
                else
                {
                    //合并菜单
                    stopAnim();
                }
                break;
            default:
                Toast.makeText(this, "当前点击的id ----"  + v.getId(), Toast.LENGTH_SHORT).show();
                break;
        }
    }
    //展开动画
    private void startAnim() {
        //位移 -- xy 一起移动 -- 集合
        for(int i = 1;i<views.size();i++)
        {
            AnimatorSet animatorSet = new AnimatorSet();

            //移动X
            ObjectAnimator animator_x = ObjectAnimator.ofFloat(views.get(i),"translationX",0f,(i-1)*100f);

            //移动Y
            ObjectAnimator animator_y = ObjectAnimator.ofFloat(views.get(i),"translationY",0f,(views.size()-i-1)*100f);

            animatorSet.play(animator_x).with(animator_y);

            animatorSet.setStartDelay(5000);//设置延迟时间

            animatorSet.start();

            flag = false;
        }

    }

    //合并动画
    private void stopAnim() {

        //位移 -- xy 一起移动 -- 集合
        for(int i = 1;i<views.size();i++)
        {
            AnimatorSet animatorSet = new AnimatorSet();

            //移动X
            ObjectAnimator animator_x = ObjectAnimator.ofFloat(views.get(i),"translationX",(i-1)*100f,0f);

            //移动Y
            ObjectAnimator animator_y = ObjectAnimator.ofFloat(views.get(i),"translationY",(views.size()-i-1)*100f,0f);

            animatorSet.play(animator_x).with(animator_y);

            animatorSet.setStartDelay(5000);//设置延迟时间

            animatorSet.start();

            flag = true;
        }
    }
}

布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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="bw.com.bw_day03_animation.demo05.PropertyActivity03">


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/img_41"
        android:layout_margin="10dp"
        android:id="@+id/img_a"
        />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/img_42"
        android:layout_margin="50dp"
        android:id="@+id/img_b"
        />


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/img_43"
        android:layout_margin="50dp"
        android:id="@+id/img_c"
        />


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/img_44"
        android:layout_margin="50dp"
        android:id="@+id/img_d"
        />


    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/img_45"
        android:layout_margin="50dp"
        android:id="@+id/img_e"
        />

</FrameLayout>

anim

enter_anim

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromYDelta="100%"
    android:toYDelta="0%"
    android:duration = "3000"
    >
</translate>

exit_anim

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromYDelta="0%"
    android:toYDelta="-100%"
    android:duration = "3000"
    >

</translate>

animator

rotation_x

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

<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:propertyName="rotationX"
    android:valueFrom="0"
    android:valueTo="720"
    android:valueType="floatType"
    android:duration="3000"
    />

scale_x

<?xml version="1.0" encoding="utf-8"?>
<!--
    android:propertyName=""  属性名称

        属性名称:
            位移:  translationX  translationY
            旋转:  rotation    rotationX   rotationY
            缩放:  scaleX      scaleY
            透明:  alpha

    android:valueFrom=""     开始的值
    android:valueTo=""       结束的值
    android:valueType=""     值的类型
-->
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:propertyName="scaleX"
    android:valueFrom="1.0"
    android:valueTo="3.0"
    android:valueType="floatType"
    android:duration="3000"
    >

</objectAnimator>

scale_y

<?xml version="1.0" encoding="utf-8"?>
<objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
    android:propertyName="scaleY"
    android:valueFrom="1.0"
    android:valueTo="3.0"
    android:valueType="floatType"
    android:duration="3000"
    >

</objectAnimator>

set_animator

<?xml version="1.0" encoding="utf-8"?>
<!--
        android:ordering="sequentially" 集合动画的执行方式
                sequentially     依次执行her         一起执行
                toget
-->
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:ordering="together"
    >

    <!--缩放X-->
    <objectAnimator
        android:propertyName="scaleX"
        android:valueFrom="1"
        android:valueTo="3"
        android:valueType="floatType"
        android:duration="3000"
        />

    <!--缩放Y-->
    <objectAnimator
        android:propertyName="scaleY"
        android:valueFrom="1"
        android:valueTo="3"
        android:valueType="floatType"
        android:duration="3000"
        />


    <!--移动Y  向上-->
    <objectAnimator
        android:propertyName="translationY"
        android:valueFrom="0"
        android:valueTo="-1500"
        android:valueType="floatType"
        android:duration="3000"
        />
</set>