Android开发之补间动画

最新推荐文章于 2024-05-01 17:26:01 发布

启之灵

最新推荐文章于 2024-05-01 17:26:01 发布

阅读量524

点赞数

分类专栏： Android 特效文章标签： fragment切换动画补间动画平移动画旋转缩放渐变动画

本文链接：https://blog.csdn.net/z_x_Qiang/article/details/75731402

版权

Android 特效专栏收录该内容

41 篇文章 1 订阅

订阅专栏

安卓的补间动画

补间动画在动画界早都存在的技术，android是在2.0版本以后引进的。补间动画其实只是在屏幕上做了效果的绘制，其实组件的真是位置并没有发生改变。

主要应用场景，组件，布局，fragment，activity都能使用这种动画技术

本文以fragment的切换动画为例进行讲解：

1.平移动画：

如上图效果，左右平移的动画，对角平移那个渐变动画，下面会讲到。

补间动画有自己的专属文件夹存放，在res目录下建立anim文件夹，在anim文件夹中创建自己想要的动画。

创建进入页面的动画：translate_fragment.xml

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

创建退出页面的动画：translate_fragment_out.xml

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

对以上属性进行解释：

android:fromXDelta 起始点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p，具体意义已在scale标签中讲述，这里就不再重讲
android:fromYDelta 起始点Y轴从标，可以是数值、百分数、百分数p 三种样式；
android:toXDelta 结束点X轴坐标
android:toYDelta 结束点Y轴坐标
android:duration 动画持续时间，以毫秒为单位
android:fillAfter 如果设置为true，控件动画结束时，将保持动画最后时的状态
android:fillBefore 如果设置为true,控件动画结束时，还原到开始动画前的状态
android:fillEnabled 与android:fillBefore 效果相同，都是在动画结束时，将控件还原到初始化状态
android:repeatCount 重复次数
android:repeatMode 重复类型，有reverse和restart两个值，reverse表示倒序回放，restart表示重新放一遍，必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型，即回放时的动作。
android:interpolator 设定插值器，其实就是指定的动作效果，比如弹跳效果等，不在这小节中讲解，后面会单独列出一单讲解。

对动画xml的调用：下面代码的bt01按钮。

package th.zxq.com.quxianyundong;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.FragmentManager;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.View;
import android.widget.FrameLayout;

import th.zxq.com.quxianyundong.fragments.fragment01;
import th.zxq.com.quxianyundong.fragments.fragment02;
import th.zxq.com.quxianyundong.fragments.fragment03;
import th.zxq.com.quxianyundong.fragments.fragment04;

/**
 * Created by Administrator on 2017/7/22.
 */

public class FragmentActivity extends AppCompatActivity {
    private FrameLayout fl;
    private FragmentManager sfm;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fragment);
        fl= (FrameLayout) findViewById(R.id.fl);
        sfm = getSupportFragmentManager();
    }
    public void button(View view)
    {
        switch (view.getId())
        {
            case R.id.bt01:
                sfm.beginTransaction()
                   .setCustomAnimations(R.anim.translate_fragment,R.anim.translate_fragment_out)
                   .replace(R.id.fl,new fragment01()).commit();
                break;
            case R.id.bt02:
                sfm.beginTransaction()
                        .setCustomAnimations(R.anim.scale_fragment_in,R.anim.scale_fragment_out)
                        .replace(R.id.fl,new fragment02()).commit();
                break;
            case R.id.bt03:
                sfm.beginTransaction()
                        .setCustomAnimations(R.anim.rotate_fragment,R.anim.rotate_fragment_out)
                        .replace(R.id.fl,new fragment03()).commit();
                break;
            case R.id.bt04:
                sfm.beginTransaction()
                    .setCustomAnimations(R.anim.alpha_fragment_in,R.anim.alpha_fragment_out)
                    .replace(R.id.fl,new fragment04()).commit();
                break;
        }
    }
}

2.缩放动画：

和上面一样，在anim文件中创建xml

进入界面的动画：scale_fragment_in.xml

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

退出界面的动画：scale_fragment_out.xml

<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXScale="1"
    android:toXScale="0"
    android:fromYScale="1"
    android:toYScale="0"
    android:duration="500"
    android:fillAfter="true">
</scale>

属性解释：

android:fromXScale 起始的X方向上相对自身的缩放比例，浮点值，比如1.0代表自身无变化，0.5代表起始时缩小一倍，2.0代表放大一倍；
android:toXScale 结尾的X方向上相对自身的缩放比例，浮点值；
android:fromYScale 起始的Y方向上相对自身的缩放比例，浮点值，
android:toYScale 结尾的Y方向上相对自身的缩放比例，浮点值；
android:pivotX 缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p，当为数值时，表示在当前View的左上角，即原点处加上50px，做为起始缩放点；如果是50%，表示在当前控件的左上角加上自己宽度的50%做为起始点；如果是50%p，那么就是表示在当前的左上角加上父控件宽度的50%做为起始点x轴坐标。（具体意义，后面会举例演示）
android:pivotY 缩放起点Y轴坐标，取值及意义跟android:pivotX一样。
android:duration 动画持续时间，以毫秒为单位
android:fillAfter 如果设置为true，控件动画结束时，将保持动画最后时的状态
android:fillBefore 如果设置为true,控件动画结束时，还原到开始动画前的状态
android:fillEnabled 与android:fillBefore 效果相同，都是在动画结束时，将控件还原到初始化状态
android:repeatCount 重复次数
android:repeatMode 重复类型，有reverse和restart两个值，reverse表示倒序回放，restart表示重新放一遍，必须与repeatCount一起使用才能看到效果。因为这里的意义是重复的类型，即回放时的动作。
android:interpolator 设定插值器，其实就是指定的动作效果，比如弹跳效果等，不在这小节中讲解，后面会单独列出一单讲解。

代码调用：上面代码的bt02

3.旋转动画：

创建进入动画：rotate_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:fromDegrees="0"
        android:toDegrees="360"
        android:duration="1000"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="true">
    </rotate>
    <scale
        android:fromXScale="0"
        android:toXScale="1"
        android:fromYScale="0"
        android:toYScale="1"
        android:duration="1000"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="true">
    </scale>
</set>

这里用到一个动画集合，就是多个动画一起执行。因为旋转不加缩放的话很难看。

创建退出动画：rotate_fragment_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <rotate
        android:fromDegrees="360"
        android:toDegrees="0"
        android:duration="500"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="true">
    </rotate>
    <scale
        android:fromYScale="1"
        android:toXScale="0"
        android:toYScale="0"
        android:fromXScale="1"
        android:duration="500"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="true"
        >
    </scale>
</set>

属性解释：

android:fromDegrees 开始旋转的角度位置，正值代表顺时针方向度数，负值代码逆时针方向度数
android:toDegrees 结束时旋转到的角度位置，正值代表顺时针方向度数，负值代码逆时针方向度数
android:pivotX 缩放起点X轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p

android:pivotY 缩放起点Y轴坐标，可以是数值、百分数、百分数p 三种样式，比如 50、50%、50%p

其实属性和上面的一样。

代码调用如上面代码的 bt03

4. 渐变动画

创建进入动画：alpha_fragment_in.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"
        android:fillAfter="true">
    </alpha>
    <scale
        android:fromXScale="0"
        android:fromYScale="0"



  
  
   
   


  
  
创建退出动画：alpha_fragment_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha
        android:fromAlpha="1"
        android:toAlpha="0"
        android:duration="1000"
        android:fillAfter="true">
    </alpha>
    <scale
        android:fromXScale="1"
        android:fromYScale="1"
        android:toYScale="0"
        android:toXScale="0"
        android:duration="1000"
        android:fillAfter="true"
        android:pivotY="100%"
        android:pivotX="100%"
        >
    </scale>
</set>

属性解释：

android:fromAlpha 动画开始的透明度，从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明
android:toAlpha 动画结束时的透明度，也是从0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明

其他和上面的一样

代码调用如上面代码的bt04

如果需要多个动画不同的动画一起执行就就创建一个动画集合set，如上面的旋转和渐变动画一样。

ps：这些都是给fragment自定义的动画设置，必须使用v4包下的fragment，不然会报错。

动画添加必须在替换fragment之前调用。

也可以通过setTransition(FragmentTransaction.TRANSIT_ENTER_MASK)方法去设置系统自带的动画。这种设置可以不用管fragment是不是v4包的。

例如：

            case R.id.bt02:
                sfm.beginTransaction()
                        .setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN)
//                        .setCustomAnimations(R.anim.scale_fragment_in,R.anim.scale_fragment_out)
                        .replace(R.id.fl,new fragment02())
                        .commit();
                break;

尊重他人，转载请注明出处，谢谢