补间动画

最新推荐文章于 2023-06-25 20:51:27 发布

wanchuan_

最新推荐文章于 2023-06-25 20:51:27 发布

阅读量251

点赞数

分类专栏：补间动画文章标签：动画

本文链接：https://blog.csdn.net/wanchuan_/article/details/71155944

版权

补间动画专栏收录该内容

1 篇文章 0 订阅

订阅专栏

补间动画

老规矩，先上菜单：

这里写图片描述

现在我们来谈一谈补间动画的特点，通常我们再需要一些动画特效时，需要改变控件的形状等属性，而用帧动画的效果时无法完全满足这样对的需求的，所以补间动画就应运而生，但是补间动画也是有缺点的，动画效果只是将图片的显示位置改变到指定的地点，并没有将其对应的属性和资源位置改变，如其点击效果，还是在控件最初的位置有效。

总结一下：

1）平移（Translate）：new TranslateAnimation();

>2) 缩放（scale）：new ScaleAnimation();

3) 透明度（alpha）:new AlphaAnimation();

4) 旋转（rotate）: new RotateAnimation();

* 每个动画效果的参数不一样，所以这里就没有具体描述，详细的可以看下面的代码。

现在我们先来看布局文件：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.wanchuan.tweenanimation.MainActivity" >
<LinearLayout 
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:orientation="horizontal"
    >
    <Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="move"
    android:text="位移" />
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="scale"
    android:text="缩放" />
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="rotate"
    android:text="旋转" />
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="alpha"
    android:text="透明" />
<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:onClick="fly"
    android:text="全动画" />
</LinearLayout>

<ImageView 
    android:id="@+id/iv_1"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/p7"
    android:layout_alignParentLeft="true"
    android:layout_centerVertical="true"
    />
<ImageView 
    android:id="@+id/iv_2"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:src="@drawable/p9"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true"
    />

接下来就是你们梦寐以求的java代码了：

package com.wanchuan.tweenanimation;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AlphaAnimation;
import android.view.animation.Animation;
import android.view.animation.AnimationSet;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;

public class MainActivity extends Activity {

private ImageView iv_1;
private ImageView iv_2;
private TranslateAnimation ta_1;
private ScaleAnimation sa;
private RotateAnimation ra;
private AlphaAnimation aa;
private TranslateAnimation ta_2;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    iv_1=(ImageView) findViewById(R.id.iv_1);
    iv_2=(ImageView) findViewById(R.id.iv_2);
}

public void move(View v)//该方法为平移的动画
{
    ta_1 = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 2, 
            Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 2);
    //定义动画持续时间
    ta_1.setDuration(2000);
    ta_1.setRepeatCount(1);//重复播放次数，额外次数
    ta_1.setRepeatMode(Animation.REVERSE);//设置重复模式（restart,源方向，reverse,反方向
    ta_1.setFillAfter(true);//在结束位置上填充动画
    iv_1.startAnimation(ta_1);

    ta_2 = new TranslateAnimation(0, -100, 0, 100);
    ta_2.setDuration(2000);
    ta_2.setFillAfter(true);  
    iv_2.startAnimation(ta_2);
}

public void scale(View v)//该方法为缩放的动画
{
    sa = new ScaleAnimation(1, 2, 1, 2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
//      ScaleAnimation sa=new ScaleAnimation(1, 2, 1, 2,iv_2.getWidth()/2,iv_2.getHeight()/2);
    sa.setDuration(2000);
    sa.setFillAfter(true);  
    iv_2.startAnimation(sa);
}
public void rotate(View v)//该方法为旋转的动画
{
    ra = new RotateAnimation(0, 360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
    ra.setDuration(2000);
    ra.setFillAfter(true);  
    iv_2.startAnimation(ra);
}
public void alpha(View v)//该方法为透明度改变的动画
{
    aa = new AlphaAnimation(0, 1);
    aa.setDuration(2000);
    aa.setFillAfter(true);  
    iv_2.startAnimation(aa);
}
public void all(View v)//该方法为所有的动画同时运行
{
    AnimationSet set=new AnimationSet(false);
    set.addAnimation(ta_2);
    set.addAnimation(aa);
    set.addAnimation(sa);
    set.addAnimation(ra);
    iv_1.startAnimation(set);
}
}

首先看看平移动画：

* new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 2,              Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF, 2);

* TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue, int fromYType, float fromYValue, int toYType, float toYValue)

arg1:表示动画开始时再X轴方向上的平移类型，有三种类型：

ABSOLUTE，绝对的，表示相对于屏幕

RELATIVE_TO_PARENT:相对于父布局

RELATIVE_TO_SELF：相对于自己
arg2:表示相对与对应平移类型的布局的X轴方向上的位移的起始位置
arg3：表示动画结束时再X轴方向上的平移类型，有三种类型和之气那的相同。
arg4：表示相对与对应平移类型的布局的X轴方向上的位移的结束位置
arg5：表示动画开始时再Y轴方向上的平移类型，有三种类型：
arg6：表示相对与对应平移类型的布局的Y轴方向上的位移的起始位置
arg7：表示动画结束时再Y轴方向上的平移类型，有三种类型和之气那的相同。

arg8：表示相对与对应平移类型的布局的Y轴方向上的位移的结束位置

*new ScaleAnimation(1, 2, 1, 2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);

*ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)

缩放动画，同样8个参数，我们来仔细解读这些参数的意义：

arg1：在动画开始时，在X轴方向上控件缩放的比例。（即横向拉伸或压缩）
arg2：在动画结束时，在X轴方向上控件缩放的比例。
arg3：在动画开始时，在Y轴方向上控件缩放的比例。（即纵向拉伸或压缩）
arg4：在动画结束时，在Y轴方向上控件缩放的比例。
arg5：在X轴方向上的相对于哪一个布局的基点进行缩放，也是和平移的三种类型相同，相对于父布局，相对于屏幕，相对于自己。
arg6：如0.5f，就是X轴方向上对应的布局类型的0.5倍布局宽度的位置，也就是中点的位置。
arg7：在Y轴方向上的相对于哪一个布局的基点进行缩放，也是和平移的三种类型相同，相对于父布局，相对于屏幕，相对于自己。
arg8：如0.5f，就是Y轴方向上对应的布局类型的0.5倍布局宽度的位置，也就是中点的位置。

如果最后4个参数对应的布局类型为同一个布局，且对应的缩放基点都是0.5f，就表示缩放的基点为该布局的几何中心点。

* new RotateAnimation(0, 360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);

* RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)

旋转动画：6个参数，其中后面4个参数和之前的解释相同，就是相对于布局类型。我这里就直接是前面2个参数的意义。

arg1：动画开始时，控件起始旋转位置的角度。这里的角度通常是从X轴以顺时针方向为正。

arg2：动画结束时，控件的停止位置的角度。

 * new AlphaAnimation(0, 1);

 * AlphaAnimation(float fromAlpha, float toAlpha)

透明度动画，2个参数。

透明度的参数在0~1之间。0表示完全透明，1表示不透明。
arg1：动画开始时的透明度。
arg2：动画结束时的透明度。

也可以将之前的这些动画，合并到一起，同时展示：

`public void fly(View v)
{
    AnimationSet set=new AnimationSet(false);//创建一个动画集合，false表示这些动画使用的各自的校对器
    set.addAnimation(ta_2);//将上面的动画对象添加到集合中
    set.addAnimation(aa);
    set.addAnimation(sa);
    set.addAnimation(ra);
    iv_1.startAnimation(set);//开启动画
}`

同时这些动画也可以通过布局文件来实现，在res文件夹下创建一个anim的文件夹，里面就可以创建对应动画的xml文件。放上两个动画的XML文件，另外2个动画类似，就不再贴出代码了。

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

</scale>

这是缩放的动画的XML文件↑

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

</translate>

这是平移的动画的XML文件↑

感谢各位的阅读，让我们一起进步。

wanchuan_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
补间动画

补间动画老规矩，先上菜单：现在我们来谈一谈补间动画的特点，通常我们再需要一些动画特效时，需要改变控件的形状等属性，而用帧动画的效果时无法完全满足这样对的需求的，所以补间动画就应运而生，但是补间动画也是有缺点的，动画效果只是将图片的显示位置改变到指定的地点，并没有将其对应的属性和资源位置改变，如其点击效果，还是在控件最初的位置有效。总结一下：1）平移（Translate）：new TranslateA
复制链接

扫一扫