TweenAnimation补间动画

一.在Java代码中编译动画

①java程序

public class MainActivity extends Activity {

    private ImageView iv;

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

        iv = (ImageView) findViewById(R.id.iv);

        // 补间动画是不会改变动画的本质属性的.比如平移动画,View不会改变自己的位置.
        iv.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this, "大圣在此!", Toast.LENGTH_SHORT)
                        .show();
            }
        });

    }

    // 透明度动画
    public void alpha(View v) {

        // fromAlpha:起始透明度;toAlpha:终止透明度
        AlphaAnimation aa = new AlphaAnimation(0.1f, 0.5f);
        // 设置动画的持续时间
        aa.setDuration(3000);
        // 设置动画的重复次数
        aa.setRepeatCount(2);
        // 设置动画的重复模式
        // RESTART:重新开始
        // REVERSE:折返
        aa.setRepeatMode(Animation.REVERSE);
        // 保持动画结束时候的状态
        aa.setFillAfter(true);
        // 开始动画
        iv.startAnimation(aa);

    }

    // 平移动画
    public void translate(View v) {

        // 以控件自身所在的位置为标准.
        // fromXDelta:x轴上的起始点,以像素为单位;
        // toXDelta:x轴上终点;
        // fromYDelta:y轴上的起始点;
        // toYDelta:y轴上的终点.
        // TranslateAnimation ta = new TranslateAnimation(0, 100.0f, 0f,
        // 100.0f);

        // fromXType:起点时候在x轴上变化时参照的类型.
        // Animation.ABSOLUTE:极少用;Animation.RELATIVE_TO_SELF:相对自身进行变化;
        // Animation.RELATIVE_TO_PARENT:相对父窗体进行变化
        // fromXValue:x轴上的起始点.
        // toXType:终点时候在x轴上变化时参照的类型.
        // toXValue:x轴上终点.
        // Animation.RELATIVE_TO_SELF, 0:控件本身所在的坐标+0*控件本身的宽度;
        // Animation.RELATIVE_TO_SELF,2.0f:控件本身所在的坐标+2*控件本身的宽度.
        // Animation.RELATIVE_TO_PARENT, 0.2f:控件本身所在的坐标+0.2*父窗体的宽度.
        TranslateAnimation ta = new TranslateAnimation(
                Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF,
                2.0f, Animation.RELATIVE_TO_SELF, 0,
                Animation.RELATIVE_TO_SELF, -2.0f);
        ta.setDuration(2000);
        ta.setRepeatCount(2);
        ta.setFillAfter(true);
        ta.setRepeatMode(Animation.RESTART);
        iv.startAnimation(ta);

    }

    // 缩放动画
    public void scale(View v) {

        // fromX:x轴上开始缩放的起点;
        // toX:x轴上结束缩放的起点;
        // fromY:y轴....
        // toY:y轴...
        // 控件缩放的起始点:控件本身的左上角.
        // ScaleAnimation sa = new ScaleAnimation(1, 2.0f, 1, 4.0f);
        // pivotX:x轴上进行缩放的坐标值.
        // pivotY:y轴上进行缩放的坐标值.
        // pivotX:-100:控件的缩放点向左移动100个像素,然后进行缩放----->正确.
        // pivotY:50:动画要沿着y轴往下移动50个像素,然后进行缩放---->正确.
        // 注意:pivotX,pivotY的方向是与正常的方向相反的.

        // x+30:
        ScaleAnimation sa = new ScaleAnimation(1, 2.0f, 1, 4.0f, 30, 0);

        // Animation.ABSOLUTE:
        // Animation.RELATIVE_TO_SELF:
        // Animation.RELATIVE_TO_PARENT
        // Animation.RELATIVE_TO_SELF, -2:控件本身所在的坐标+2*控件本身的宽度
        // Animation.RELATIVE_TO_PARENT,0.2f:控件本身所在的坐标+0.2*父窗体的高度.
        // ScaleAnimation sa = new ScaleAnimation(1, 2, 1, 4,
        // Animation.RELATIVE_TO_SELF, -2, Animation.RELATIVE_TO_PARENT,
        // 0.2f);

        sa.setDuration(2000);
        sa.setRepeatCount(2);
        sa.setRepeatMode(Animation.REVERSE);
        sa.setFillAfter(true);
        iv.startAnimation(sa);

    }

    // 旋转动画
    public void rotate(View v) {

        // 以顺时针为正的变化范围.
        // fromDegrees:起始的角度;
        // toDegrees:终止的角度.
        //RotateAnimation ra = new RotateAnimation(0, 45);
        // pivotX:
        // pivotY:
        RotateAnimation ra = new RotateAnimation(0, 45, 50, 0);
        // pivotXType:
        // pivotXValue:
        // RotateAnimation ra = new RotateAnimation(0, 360,
        // Animation.RELATIVE_TO_SELF, 2.0f, Animation.RELATIVE_TO_SELF, 0);
        ra.setDuration(2000);
        ra.setRepeatCount(2);
        ra.setRepeatMode(Animation.RESTART);
        ra.setFillAfter(true);
        iv.startAnimation(ra);
    }

    // 动画集合
    public void set(View v) {

        // true:动画集合中所有的动画类型都共用一个插值器.
        // false:每种动画都可以使用自己的插值器.
        AnimationSet set = new AnimationSet(true);
        AlphaAnimation aa = new AlphaAnimation(0.1f, 0.5f);
        TranslateAnimation ta = new TranslateAnimation(
                Animation.RELATIVE_TO_SELF, 0, Animation.RELATIVE_TO_SELF,
                2.0f, Animation.RELATIVE_TO_SELF, 0,
                Animation.RELATIVE_TO_SELF, -2.0f);
        ScaleAnimation sa = new ScaleAnimation(1, 2, 1, 4,
                Animation.RELATIVE_TO_SELF, -2, Animation.RELATIVE_TO_PARENT,
                0.2f);
        // 添加动画
        set.addAnimation(aa);
        set.addAnimation(ta);
        set.addAnimation(sa);

        set.setDuration(2000);
        set.setRepeatCount(2);
        iv.startAnimation(set);

    }

}

MianActivity

②.xml布局。

<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" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="alpha"
            android:text="透明" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="translate"
            android:text="平移" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="scale"
            android:text="缩放" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="rotate"
            android:text="旋转" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:onClick="set"
            android:text="集合" />
    </LinearLayout>

    <ImageView
        android:id="@+id/iv"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_centerInParent="true"
        android:src="@drawable/houzi" />

</RelativeLayout>

activity_main

二.在res中编译动画

①.在res中创建一个anim文件，再在里面创建要实现的动画效果的xml文件

<alpha
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"
    android:duration="1000"
    android:fillAfter="true"
    >
    <!--
    0.0-1.0
     android:fromAlpha="1.0" 变化之前的透明度  100%
    android:toAlpha="0.5"  变化之后的透明度  50%
    android:duration="1000"  变化的时间间隔
    android:fillAfter="true"动画结束后  维持到最后动画状态

    -->

</alpha>

alpha_animation

<rotate
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0.0"
    android:toDegrees="-360.0"
       android:pivotX="50%"
    android:pivotY="50%"
    android:duration="1000"
    android:repeatCount="infinite"
    android:repeatMode="restart"

    >
    <!--

    android:fromDegrees="0.0"  开始的起始角度
    android:toDegrees="-360.0" 结束后的角度
    android:pivotX="0.5"
    android:pivotY="0.5"
    android:duration="1000"

    android:repeatCount="infinite"  无限循环
    android:repeatMode="restart"  restart 正向   reverse反向
      -->

</rotate>

rotate_animation

<scale
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="1.0"
    android:toXScale="0.5"
    android:fromYScale="1.0"
    android:toYScale="0.5"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="1000"
    android:fillAfter="true"
    >
    <!--
    android:fromXScale="1.0"  变化前x轴的值  100%
    android:toXScale="0.5" 变化后 x轴的值 50%
    android:fromYScale="1.0" 变化前y轴的值
    android:toYScale="0.5" 变化后y轴的值
    android:pivotX="0.5"  x轴的图片位置  为原点  50%
    android:pivotY="0.5"  y轴的图片位置  为原点  50%
    android:duration="1000"
    android:fillAfter="true" -->

</scale>

scale_animation

<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="1000"
    android:fillAfter="true"
    android:fromXDelta="0.0"
    android:fromYDelta="0.0"
    android:toXDelta="0.0"
    android:toYDelta="70.0" >

</translate>

translate_animation

<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:interpolator="@android:anim/decelerate_interpolator" >

    <rotate
        android:duration="1000"
        android:fromDegrees="0.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="-360.0" />

    <translate
        android:duration="1000"
        android:fillAfter="true"
        android:fromXDelta="0.0"
        android:fromYDelta="0.0"
        android:startOffset="1000"
        android:toXDelta="0.0"
        android:toYDelta="70.0" >

    </translate>

    <!--
    set:集合动画
     android:startOffset="1000"  动画的间隔时间

    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    @android:anim/accelerate_decelerate_interpolator:先加速后减速
    accelerate_interpolator :一直加速
    decelerate_interpolator:一直减速
    @android:anim/linear_interpolator:匀速

    动画的插入器:  加速  减速   先减速后加速...

    -->

</set>

set_animation

②.JAVA程序

public class MainActivity extends Activity {

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

        iv = (ImageView) findViewById(R.id.iv_show);
    }

    public void OnclickBtn(View v){

        switch (v.getId()) {
        case R.id.btn_alpha://淡入淡出
            //startAnimation  控制开启动画  AnimationUtils.loadAnimation将动画引入进来
            iv.startAnimation(AnimationUtils.loadAnimation(this, R.anim.alpha_animation));
            break;
        case R.id.btn_scale://缩放
            //startAnimation  控制开启动画  AnimationUtils.loadAnimation将动画引入进来
            iv.startAnimation(AnimationUtils.loadAnimation(this, R.anim.scale_animation));
            break;
        case R.id.btn_translate://位移
            //startAnimation  控制开启动画  AnimationUtils.loadAnimation将动画引入进来
            iv.startAnimation(AnimationUtils.loadAnimation(this, R.anim.translate_animation));
            break;
        case R.id.btn_rotate://旋转
            //startAnimation  控制开启动画  AnimationUtils.loadAnimation将动画引入进来
            iv.startAnimation(AnimationUtils.loadAnimation(this, R.anim.set_rotate));
            break;

        default:
            break;
        }
    }

}

MainActivity

③.xml布局

<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"
     >

    <ImageView
        android:id="@+id/iv_show"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@drawable/ic_launcher"
         />

    <Button
        android:id="@+id/btn_alpha"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/iv_show"
        android:onClick="OnclickBtn"
        android:text="淡入淡出  alpha"
        />
    <Button
        android:id="@+id/btn_scale"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_alpha"
        android:onClick="OnclickBtn"
        android:text="缩放  scale"
        />
    <Button
        android:id="@+id/btn_translate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/iv_show"
        android:layout_toRightOf="@id/btn_alpha"
        android:onClick="OnclickBtn"
        android:text="位移  translate"
        />
    <Button
        android:id="@+id/btn_rotate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/btn_alpha"
        android:layout_toRightOf="@id/btn_scale"
        android:onClick="OnclickBtn"
        android:text="旋转  rotate"
        />
</RelativeLayout>

文件

时间： 2024-10-28 21:14:27

TweenAnimation补间动画的相关文章

Android开发之补间动画、

四种补间动画: 1.透明: 2.缩放: 3.位移: 4.旋转: 1 //点击按钮 实现iv 透明的效果 动画 2 public void click1(View v) { 3 //1.0意味着着完全不透明 0.0意味着完全透明 4 AlphaAnimation aa = new AlphaAnimation(1.0f, 0.0f); 5 aa.setDuration(2000); //设置动画执行的时间 6 aa.setRepeatCount(1); //设置重复的次数 7 aa.setRepe

Android开发实战之补间动画和属性动画

说起动画,其实一点也不陌生,在使用一款app的时候为了优化用户体验,多多少少的,都会加入动画. 安卓中的动画,分为两大类:补间动画和属性动画.本篇博文会详细介绍总结这两大动画,希望本篇博文对你的学习和生活有所帮助. **补间动画** 补间动画分为四类:平移动画,旋转动画,缩放动画和渐变动画.这几类动画用法都差不多,只是对象参数不同这里我统一展示出来.以下是效果图: 实现代码很简单: btn1.setOnClickListener(new View.OnClickListener() { @Ove

Android开发之Tween(补间动画)完全解析(下)

欢迎转载,转载请注明出处:http://blog.csdn.net/dmk877/article/details/51980734 在上一篇文章中,我们详细讨论了Tween动画的xml的实现以及interpolator的使用,相信通过上篇文章大家对Tween动画的xml属性的配置会有一个详细的理解,当然这篇文章也是承接上篇文章,所以强烈建议先阅读上篇文章:Android开发之Tween(补间动画)完全解析(上),这篇文章将从代码的角度实现上篇文章的效果.如有疑问请留言,如有谬误欢迎批评指正. T

android 动画（1） 补间动画

android动画: 3.0以前,android支持两种动画模式,tween animation,frame animation, 3.0中又引入了一个新的动画系统:property animation, 这三种动画模式在SDK中被称为 property animation,        属性动画: view animation,   补间动画:  给出两个关键帧,通过一些算法将给定属性值在给定的时间内在两个关键帧间渐变. (Tween animation) drawable animatio

Android动画--帧动画和补间动画

帧动画 首先我们定义在drawable文件夹下定义一个xml文件 里面包含我们要播放的动画的图片,以及每一帧动画的播放的时长 <?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@mi

实现逐帧动画和补间动画两种动画效果

1.逐帧动画(Frame Animation)通常在Android项目的res/drawable/目录下面定义逐帧动画的XML模板文件.编码的时候,需要在动画模板文件的<animation-list>标签中依次放入需要播放的图片,并设置好播放的间隔时间. <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"

深入学习Phaser补间动画

Tweens是什么? Tweens通常被称为补间动画.补间动画是指在确定好两个关键帧之后,由计算机自动生成这两帧之间插补帧,从而实现动画的过程.例如,物体从当前位置在两秒内向右移动200个像素,只要设置好目标位置(当前位置的右边200像素)和时长(两秒),则计算机会自动生成补间动画,在两秒内使物体从当前位置移到目标位置. 创建一个Tween 补间的目标对象 最常见的创建一个补间动画的语句如下所示: var tween =this.game.add.tween(this.sprite).to({ 

Android中的补间动画(tween)的简单使用

相对帧动画,补间动画(tween)可以这么理解:我们不必像帧动画一样指定动画的每一帧,只需定义一个动画的开始和结束关键帧,而中间变化的帧由系统帮我们计算. tween动画可以分为下面几种: AlphaAnimation(透明渐变动画): 示例:res/anim/alpha.xml <?xml version="1.0" encoding="utf-8"?> <alpha xmlns:android="http://schemas.andr

高速上手Unity中最好的补间动画插件DFTween

?? 出处:http://blog.csdn.net/u010019717 author:孙广东      时间:2015.3.17   23:00 DFTween 是一个在 Unity 游戏引擎中高速和easy使用的animation动画库. 它支持不论什么对象的tweening补间的属性, 并能够轻松地进行工作与您自己自己定义数据类型.API 非常简单可是功能非常强大,使其易于创建复杂的tweens补间和sequences序列.它已被优化从优秀性能.同一时候具有低内存和低CPU 要求. ·高