Android移动应用开发之制作动画基础

Posted Icy Hunter

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android移动应用开发之制作动画基础相关的知识,希望对你有一定的参考价值。

文章目录

帧动画

顾名思义,需要我们准备好一帧一帧的图片,然后连续播放组成动画。

主要文件目录

MainActivity

package zufe.scq.hunter;

import androidx.appcompat.app.AppCompatActivity;

import android.app.AlertDialog;
import android.content.DialogInterface;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;


public class MainActivity extends AppCompatActivity 
    private boolean flag = true;
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        RelativeLayout relativeLayout = findViewById(R.id.rl);
        AnimationDrawable anim = (AnimationDrawable) relativeLayout.getBackground();
        relativeLayout.setOnClickListener(new View.OnClickListener() 
            @Override
            public void onClick(View v) 
                if(flag)
                    anim.start();
                    flag=false;
                else
                    anim.stop();
                    flag=true;
                
            
        );
    

frame.xml

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/frame1" android:duration="320"/>
    <item android:drawable="@drawable/frame2" android:duration="320"/>
    <item android:drawable="@drawable/frame3" android:duration="320"/>
</animation-list>

这里就是把准备好的图片放进去就行,duration表示每帧播放的时长

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/rl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/frame"
    />

相当于将frame.xml当成了一个图片直接调用了。
这里设置id,方便控制动画的进行和停止。

运行


运行一开始不动。
点击一下动画开始,再点一下动画结束。

补间动画

补间动画就是Android会自己帮我们补齐动画,有四种类型分别是透明度、旋转、缩放和评议四种。

主要文件目录

MainActivity

package zufe.scq.hunter;

import androidx.appcompat.app.AppCompatActivity;

import android.app.AlertDialog;
import android.content.DialogInterface;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;


public class MainActivity extends AppCompatActivity 
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ImageView imageView = findViewById(R.id.iv);

        imageView.setOnClickListener(new View.OnClickListener() 
            @Override
            public void onClick(View v) 
//                透明度
//              Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.alpha);
                
//                旋转
//                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.rotate);
                
//                缩放
//                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
//                        R.anim.scale);
//                imageView.startAnimation(animation);

//                平移
                Animation animation = AnimationUtils.loadAnimation(MainActivity.this,
                        R.anim.translate);
                imageView.startAnimation(animation);
            
        );
    

alpha.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<alpha
    android:fromAlpha="0"
    android:toAlpha="1"
    android:duration="2000"
    />
</set>

rorate.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:toDegrees="360"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="2000"
        />
</set>

scale.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:fromXScale="1"
        android:fromYScale="1"
        android:toXScale="0.5"
        android:toYScale="0.5"
        android:pivotY="50%"
        android:pivotX="50%"
        android:duration="2000"
        />
</set>

translate.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0"
        android:fromYDelta="0"
        android:toXDelta="400"
        android:toYDelta="400"
        android:duration="2000"
        />
</set>

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <ImageView
        android:id="@+id/iv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:adjustViewBounds="true"
        android:maxWidth="300dp"
        android:maxHeight="300dp"
        android:src="@drawable/frame3"
        />
</RelativeLayout>

运行

透明度

旋转

缩放

平移

属性动画

简单来说,就是可以持续改变属性值,达到动画的效果。

主要文件目录

MainActivity

package zufe.scq.hunter;

import androidx.appcompat.app.AppCompatActivity;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.ObjectAnimator;
import android.animation.ValueAnimator;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.PopupWindow;
import android.widget.RelativeLayout;


public class MainActivity extends AppCompatActivity 
    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

//        控制某个属性
        ValueAnimator valueAnimator =  ValueAnimator.ofFloat(0f, 1f);
        valueAnimator.setDuration(2000);
        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() 
            @Override
            public void onAnimationUpdate(ValueAnimator animation) 
                float value = (float) animation.getAnimatedValue();
//                Log.e("hunter", "OnAnimationUpdate"+value);
            
        );
        valueAnimator.start();

//        控制控件
        ImageView imageView = findViewById(R.id.iv);
        ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(imageView,
                "alpha", 0f, 1f);
        objectAnimator.setDuration(4000);

//        一组监听
//        objectAnimator.addListener(new Animator.AnimatorListener() 
//            @Override
            动画开始时调用
//            public void onAnimationStart(Animator animation) 
//                Log.e("hunter", "start");
//            
//
            结束
//            @Override
//            public void onAnimationEnd(Animator animation) 
//                Log.e("hunter", "over");
//            
//
            取消
//            @Override
//            public void onAnimationCancel(Animator animation) 
//            
          重复
//            @Override
//            public void onAnimationRepeat(Animator animation) 
//
//            
//        );

//        单个监听
        objectAnimator.addListener(new AnimatorListenerAdapter() 
            @Override
            public void onAnimationStart(Animator animation) 
                super.onAnimationStart(animation);
                Log.e("hunter", "Start");
            
        );

        objectAnimator.addListener(new AnimatorListenerAdapter() 
            @Override
            public void onAnimationEnd(Animator animation) 
                super.onAnimationEnd(animation);
                Log.e("hunter", "end");
            
        );

        objectAnimator.setStartDelay(1);
        objectAnimator.start();
    

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <ImageView
        android:id="@+id/iv"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:adjustViewBounds="true"
        android:maxWidth="300dp"
        android:maxHeight="300dp"
        android:src="@drawable/frame3"
        />
</RelativeLayout>

运行


运行可以看到透明度发生变化
控制台有对应事件监听的输出

以上是关于Android移动应用开发之制作动画基础的主要内容,如果未能解决你的问题,请参考以下文章

Android动画之视图动画和属性动画

js动画之速度

使用jQuery快速高效制作网页特效-----------------------------之jQuery事件与动画

UGUI之菜单动画效果制作思路

如何用android动画移动/改变对象的方向?

android中的动画之属性动画