Android動畫之ScaleAnimation使用

什麼是ScaleAnimation

ScaleAnimation即縮放動畫，應用場景特别多，比如常見的隐藏菜單點選顯示

下面我分兩種方式來介紹ScaleAnimation如何使用。

1. xml檔案形式

檔案名：anim_scale_in.xml

效果：呈現view放大顯示效果

源碼：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/decelerate_interpolator"
        android:duration="1000"
        android:fillAfter="true"
        android:fromXScale="0.0"
        android:fromYScale="0.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
</set>

屬性解釋：

interpolator：動畫插入器，該功能在xml裡設定貌似無效，需在代碼中加

fromXScale:從自身x軸長度多少倍開始縮放，如：fromXScale= 0.5表示從自身X軸長度0.5倍開始縮放

toXScale:縮放到自身x軸長度多少倍結束,如：toXScale = 2.0表示x軸縮放到自身x軸長度2倍結束

上面兩條意思就是：該view的x軸從自身x軸長度的0.5倍開始縮放到自身x軸長度的2倍結束

fromYScale：從自身y軸長度多少倍開始縮放，如：fromYScale= 0.5表示從自身y軸長度0.5倍開始縮放

toYScale：縮放到自身y軸長度多少倍結束,如：toYScale = 2.0表示x軸縮放到自身y軸長度2倍結束

pivotX:動畫相對于控件X坐标的開始位置

pivotY:動畫相對于控件Y坐标的開始位置

如：pivotX = 50%,pivotY = 50% 表示從該控件的中心開始縮放

//表示控件左下角開始
   android:pivotX="0"
   android:pivotY="100%"

   //表示控件左上角開始
   android:pivotX="0"
   android:pivotY="0"

   //表示控件右下角開始
    android:pivotX="100%"
    android:pivotY="100%"

   //表示控件右上角開始
   android:pivotX="100%"
   android:pivotY="0"

………………………………………………………………………………………………………………….

檔案名：anim_scale_out.xml

效果：呈現view縮小的效果

源碼：

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

………………………………………………………………………………………………………………….

OK，現在有了xml布局檔案，我們需要用Java代碼讓他工作起來，如下;

/**
     * 縮放變大動畫
     *
     * @param context
     * @param view 目标view
     */
    public static void startScaleInAnim(Context context, View view) {
        Animation animation = AnimationUtils.loadAnimation(context, R.anim.anim_scale_in);
        if (view != null)
            view.startAnimation(animation);
    }

    /**
     * 縮放縮小動畫
     *
     * @param context
     * @param view 目标view
     */
    public static void startScaleOutAnim(Context context, View view) {
        Animation animation = AnimationUtils.loadAnimation(context, R.anim.anim_scale_out);
        if (view != null)
            view.startAnimation(animation);
    }

我單獨封裝在一個動畫工具類中，哪裡需要就哪裡調用。很友善

2.純Java代碼形式

updating……

下面看看代碼的執行效果：

Android動畫之ScaleAnimation使用

縮放同時還可以添加透明度變化，如下：

放大+淡入：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/decelerate_interpolator"
        android:duration="1000"
        android:fillAfter="true"
        android:fillEnabled="true"
        android:fromXScale="0"
        android:fromYScale="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <!--同時配置淡入功能-->
    <alpha
        android:duration="700"
        android:fillAfter="true"
        android:fromAlpha="0"
        android:toAlpha="1" />
</set>

縮小+淡出

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="1000"
        android:fillAfter="true"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0"
        android:toYScale="0" />
    <!--同時配置淡出功能-->
    <alpha
        android:duration="700"
        android:fillAfter="true"
        android:fromAlpha="1"
        android:toAlpha="0" />
</set>

效果如下：

Android動畫之ScaleAnimation使用

下拉菜單顯示與收回，效果：

顯示：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/decelerate_interpolator"
        android:duration="300"
        android:fillAfter="true"
        android:fillEnabled="true"
        android:fromXScale="1.0"
        android:fromYScale="0"
        android:pivotX="100%"
        android:pivotY="0"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <!--同時配置淡入功能-->
    <alpha
        android:duration="300"
        android:fillAfter="true"
        android:fromAlpha="0"
        android:toAlpha="1" />
</set>

收起：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="300"
        android:fillAfter="true"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="100%"
        android:pivotY="0"
        android:toXScale="1.0"
        android:toYScale="0" />
    <!--同時配置淡出功能-->
    <alpha
        android:duration="300"
        android:fillAfter="true"
        android:fromAlpha="1"
        android:toAlpha="0" />
</set>

效果：

Android動畫之ScaleAnimation使用

縮放下拉與收回效果：

顯示：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/decelerate_interpolator"
        android:duration="200"
        android:fillAfter="true"
        android:fillEnabled="true"
        android:fromXScale="0"
        android:fromYScale="0"
        android:pivotX="100%"
        android:pivotY="0"
        android:toXScale="1.0"
        android:toYScale="1.0" />
    <!--同時配置淡入功能-->
    <alpha
        android:duration="200"
        android:fillAfter="true"
        android:fromAlpha="0"
        android:toAlpha="1" />
</set>

收起：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="200"
        android:fillAfter="true"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="100%"
        android:pivotY="0"
        android:toXScale="0"
        android:toYScale="0" />
    <!--同時配置淡出功能-->
    <alpha
        android:duration="200"
        android:fillAfter="true"
        android:fromAlpha="1"
        android:toAlpha="0" />
</set>

效果：

Android動畫之ScaleAnimation使用

類似遊戲按鈕的按下放大再還原效果：

public static void animScaleIn(View view){
        //縮放動畫
        ScaleAnimation animation = new ScaleAnimation(,,,,Animation.RELATIVE_TO_SELF,,Animation.RELATIVE_TO_SELF,);
        animation.setDuration();
        animation.setFillAfter(true);
        animation.setRepeatMode(Animation.REVERSE);
        animation.setRepeatCount();

        //透明度動畫
        AlphaAnimation animation1 = new AlphaAnimation(,);
        animation1.setDuration();
        animation1.setRepeatCount();
        animation1.setRepeatMode(Animation.REVERSE);
        animation1.setFillAfter(true);

        //裝入AnimationSet中
        AnimationSet set = new AnimationSet(true);
        set.addAnimation(animation);
        set.addAnimation(animation1);

        if (view != null)
        view.startAnimation(set);

    }

效果如下：

Android動畫之ScaleAnimation使用

備注：由于我的圖檔是導出視訊再用PS轉換成的gif，故效率上有所損失，實際動畫效果和速度比圖檔的快。

Android動畫之ScaleAnimation使用

什麼是ScaleAnimation

下面我分兩種方式來介紹ScaleAnimation如何使用。

OK，現在有了xml布局檔案，我們需要用Java代碼讓他工作起來，如下;

縮放同時還可以添加透明度變化，如下：

下拉菜單顯示與收回，效果：

縮放下拉與收回效果：

類似遊戲按鈕的按下放大再還原效果：

效果如下：

繼續閱讀

Android動畫超簡單的6種activity進入傳回動畫小白馬上就可以使用新activity進入方式activity實作跳轉動畫代碼

以下是一個可視化資料大屏的UI設計案例：布局設計：大螢幕設計應該有清晰的布局，以便使用者能夠快速浏覽和了解資料。可以采用分

Android動畫之PropertyAnimation;Interpolator;Evaluator與Keyframe

安卓View滑動之利用動畫實作彈性滑動

Android 動畫的使用，以及組合動畫

Android Q深色模式源碼解析

走穿Android動畫---補間動畫alpha、scale、translate、rotate、set的xml屬性及用法走穿Android動畫—補間動畫alpha、scale、translate、rotate、set的xml屬性及用法下面是補間動畫和各種屬性的詳細講解。共勉：成功是失敗走剩的路。

Android 自定義 View 基礎篇

Android 自定義View練手Demo（三）實作微信拍一拍的動畫效果Android自定義View實作微信拍一拍的動畫效果推薦一下我開源的項目 WanAndroid 用戶端

android 屬性動畫監聽android 屬性動畫結束監聽

Android屬性動畫總結Android屬性動畫總結

ViewPager動畫詳解 ViewPager動畫的實作原理 AndroidImageSlider動畫庫解析為ViewPager的Page内容添加動畫，實作炫酷的互動效果總結： GitHub上相關的ViewPager動畫的項目

viewpager切換動畫

Android-動畫的坐标系統

Android view動畫之縮放動畫

《Android動畫高手成長記》跳跳球效果