Android—动画

来源：互联网发布：mac chrome flash 发热编辑：程序博客网时间：2024/06/05 08:44

思维导图：

动画两大类

View Animation视图动画

① 补间动画 Tween Animation

1、什么是补间动画

Tween（补间）动画可以在一个视图容器内执行一系列简单变换（位置、大小、旋转、透明度）。譬如，如果你有一个TextView对象，您可以移动、旋转、缩放、透明度设置其文本，当然，如果它有一个背景图像，背景图像会随着文本变化。

2、补间动画种类java类名xml关键字描述信息AlphaAnimation<alpha> 放置在res/anim/目录下渐变透明度动画效果RotateAnimation<rotate> 放置在res/anim/目录下画面转移旋转动画效果ScaleAnimation<scale> 放置在res/anim/目录下渐变尺寸伸缩动画效果TranslateAnimation<translate> 放置在res/anim/目录下画面转换位置移动动画效果AnimationSet<set> 放置在res/anim/目录下一个持有其它动画元素alpha、scale、translate、rotate或者其它set元素的容器

3、属性详解

3.1Animation属性

xml属性java方法解释android:detachWallpapersetDetachWallpaper(boolean)是否在壁纸上运行android:durationsetDuration(long)动画持续时间，毫秒为单位android:fillAftersetFillAfter(boolean)控件动画结束时是否保持动画最后的状态android:fillBeforesetFillBefore(boolean)控件动画结束时是否还原到开始动画前的状态android:fillEnabledsetFillEnabled(boolean)与android:fillBefore效果相同android:interpolatorsetInterpolator(Interpolator)设定插值器（指定的动画效果，譬如回弹等）android:repeatCountsetRepeatCount(int)重复次数android:repeatModesetRepeatMode(int)重复类型有两个值，reverse表示倒序回放，restart表示从头播放android:startOffsetsetStartOffset(long)调用start函数之后等待开始运行的时间，单位为毫秒android:zAdjustmentsetZAdjustment(int)表示被设置动画的内容运行时在Z轴上的位置（top/bottom/normal），默认为normal

3.2ALpha属性详解
xml属性java方法解释android:fromAlphaAlphaAnimation(float fromAlpha, …)动画开始的透明度（0.0到1.0，0.0是全透明，1.0是不透明）android:toAlphaAlphaAnimation(…, float toAlpha)动画结束的透明度，同上

3.3Rotate属性详解

xml属性java方法解释android:fromDegreesRotateAnimation(float fromDegrees, …)旋转开始角度，正代表顺时针度数，负代表逆时针度数android:toDegreesRotateAnimation(…, float toDegrees, …)旋转结束角度，正代表顺时针度数，负代表逆时针度数android:pivotXRotateAnimation(…, float pivotX, …)缩放起点X坐标（数值、百分数、百分数p，譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点）android:pivotYRotateAnimation(…, float pivotY)缩放起点Y坐标，同上规律
3.4Scale属性详解
xml属性java方法解释android:fromXScaleScaleAnimation(float fromX, …)初始X轴缩放比例，1.0表示无变化android:toXScaleScaleAnimation(…, float toX, …)结束X轴缩放比例android:fromYScaleScaleAnimation(…, float fromY, …)初始Y轴缩放比例android:toYScaleScaleAnimation(…, float toY, …)结束Y轴缩放比例android:pivotXScaleAnimation(…, float pivotX, …)缩放起点X轴坐标（数值、百分数、百分数p，譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点）android:pivotYScaleAnimation(…, float pivotY)缩放起点Y轴坐标，同上规律
3.5 Translate 属性详解
xml属性java方法解释android:fromXDeltaTranslateAnimation(float fromXDelta, …)起始点X轴坐标（数值、百分数、百分数p，譬如50表示以当前View左上角坐标加50px为初始点、50%表示以当前View的左上角加上当前View宽高的50%做为初始点、50%p表示以当前View的左上角加上父控件宽高的50%做为初始点）android:fromYDeltaTranslateAnimation(…, float fromYDelta, …)起始点Y轴从标，同上规律android:toXDeltaTranslateAnimation(…, float toXDelta, …)结束点X轴坐标，同上规律android:toYDeltaTranslateAnimation(…, float toYDelta)结束点Y轴坐标，同上规律

Animation类的方法解释reset()重置Animation的初始化cancel()取消Animation动画start()开始Animation动画setAnimationListener(AnimationListener listener)给当前Animation设置动画监听hasStarted()判断当前Animation是否开始hasEnded()判断当前Animation是否结束

View类的常用动画操作方法解释startAnimation(Animation animation)对当前View开始设置的Animation动画clearAnimation()取消当View在执行的Animation动画

案列:

anim文件夹下

iv_alpha.xml

<?xml version="1.0" encoding="utf-8"?><alpha xmlns:android="http://schemas.android.com/apk/res/android"    android:fromAlpha="1.0"    android:toAlpha="0.3"    android:duration="3000"    android:fillAfter="true"    ></alpha>

iv_rotate.xml

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

iv_scale.xml

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

iv_scale2.xml

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

iv_translate.xml

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

iv_all.xml

<?xml version="1.0" encoding="utf-8"?><set xmlns:android="http://schemas.android.com/apk/res/android"    android:duration="3000"    android:fillAfter="true"    >    <alpha        android:fromAlpha="1.0"        android:toAlpha="0.3"        >    </alpha>    <rotate        android:fromDegrees="0"        android:toDegrees="720"        android:pivotX="50%"        android:pivotY="50%"        >    </rotate>    <scale        android:fromXScale="100%"        android:toXScale="50%"        android:fromYScale="100%"        android:toYScale="150%"        android:pivotX="50%"        android:pivotY="50%"        >    </scale>    <translate        android:fromXDelta="0"        android:toXDelta="50%"        android:fromYDelta="0"        android:toYDelta="50%"        >    </translate></set>

XML 布局文件

<?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="com.zking.administrator.g160628_android17_animation.MainActivity">    <ImageView        android:layout_width="300dp"        android:layout_height="200dp"        android:src="@drawable/heart"        android:id="@+id/iv_main_image"        />    <HorizontalScrollView        android:layout_width="match_parent"        android:layout_height="wrap_content">    <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="alpha"            android:onClick="operation"            android:id="@+id/btn_main_alpha"            />        <Button            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="rotate"            android:onClick="operation"            android:id="@+id/btn_main_rotate"            /><Button            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="scale"            android:onClick="operation"            android:id="@+id/btn_main_scale"            /><Button            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="translate"            android:onClick="operation"            android:id="@+id/btn_main_translate"            />        <Button            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:text="all"            android:onClick="operation"            android:id="@+id/btn_main_all"            />    </LinearLayout>    </HorizontalScrollView></LinearLayout>

Java核心代码

package com.zking.administrator.g160628_android17_animation;import android.animation.ObjectAnimator;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.view.animation.Animation;import android.view.animation.AnimationUtils;import android.widget.ImageView;import android.widget.Toast;public class MainActivity extends AppCompatActivity {    private ImageView iv_main_image;    private Animation animation;    private Animation animation2;    private Animation animation1;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        iv_main_image = (ImageView) findViewById(R.id.iv_main_image);        iv_main_image.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                Toast.makeText(MainActivity.this, "点击了图片", Toast.LENGTH_SHORT).show();            }        });                    }    public void operation(View view){        switch (view.getId()) {            case R.id.btn_main_alpha:                //加载动画                animation = AnimationUtils.loadAnimation(this, R.anim.iv_alpha);                break;            case R.id.btn_main_rotate:                //加载动画                 animation=AnimationUtils.loadAnimation(this,R.anim.iv_rotate);                break;            case R.id.btn_main_scale:                //加载动画                //缩动画                animation1 = AnimationUtils.loadAnimation(this, R.anim.iv_scale);                //放动画                animation2 = AnimationUtils.loadAnimation(this, R.anim.iv_scale2);                //给动画设置监听                animation1.setAnimationListener(new Animation.AnimationListener() {                    @Override                    public void onAnimationStart(Animation animation) {                    }                    @Override                    public void onAnimationEnd(Animation animation) {                          iv_main_image.startAnimation(animation2);                    }                    @Override                    public void onAnimationRepeat(Animation animation) {                    }                });                animation2.setAnimationListener(new Animation.AnimationListener() {                    @Override                    public void onAnimationStart(Animation animation) {                    }                    @Override                    public void onAnimationEnd(Animation animation) {                        iv_main_image.startAnimation(animation1);                    }                    @Override                    public void onAnimationRepeat(Animation animation) {                    }                });                //给图片开启动画                iv_main_image.startAnimation(animation1);                return;            case R.id.btn_main_translate:                //加载动画                //animation=AnimationUtils.loadAnimation(this,R.anim.iv_translate);                //使用属性动画实现图片的移动                ObjectAnimator.ofFloat(iv_main_image,"translationX",0,200).setDuration(2000).start();                ObjectAnimator.ofFloat(iv_main_image,"translationY",0,200).setDuration(2000).start();                break;            case R.id.btn_main_all:                animation=AnimationUtils.loadAnimation(this,R.anim.iv_all);                break;        }       // iv_main_image.startAnimation(animation);    }}

②帧动画 Frame Animation

Property Animation (3.0以后才有的) 属性动画

1、什么是帧动画

Drawable动画其实就是Frame动画（帧动画），它允许你实现像播放幻灯片一样的效果，这种动画的实质其实是Drawable，所以这种动画的XML定义方式文件一般放在res/drawable/目录下。

2、帧动画的详解

<animation-list> 必须是根节点，包含一个或者多个<item>元素，属性有：android:oneshot true代表只执行一次，false循环执行。

<item> 类似一帧的动画资源。<item>

animation-list的子项，包含属性如下：

android:drawable 一个frame的Drawable资源。

android:duration 一个frame显示多长时间。

帧动画实例

XML代码：iv_frame.xml

<?xml version="1.0" encoding="utf-8"?><animation-list xmlns:android="http://schemas.android.com/apk/res/android"    android:oneshot="true"    >       <item android:drawable="@drawable/anim_0010001" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010002" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010003" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010004" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010005" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010006" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010007" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010008" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010009" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010010" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010011" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010012" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010013" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010014" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010015" android:duration="2000"></item>       <item android:drawable="@drawable/anim_0010016" android:duration="200"></item>       <item android:drawable="@drawable/anim_0010017" android:duration="200"></item></animation-list>

布局文件：

<?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="com.zking.administrator.g160628_android17_animation.FrameActivity">    <ImageView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/iv_frame_image"        android:background="@drawable/iv_frame"        />    <Button        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="开始"        android:onClick="start"        /></LinearLayout>

核心代码：

package com.zking.administrator.g160628_android17_animation;import android.graphics.drawable.AnimationDrawable;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.widget.ImageView;public class FrameActivity extends AppCompatActivity {    private ImageView iv_frame_image;    private AnimationDrawable animationDrawable;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_frame);        iv_frame_image = (ImageView) findViewById(R.id.iv_frame_image);        animationDrawable = (AnimationDrawable) iv_frame_image.getBackground();    }    public void start(View view){        animationDrawable.start();    }}

阅读全文

0 0