文章目錄
一、視圖動畫標籤
0.概述
視圖動畫有5中類型組成：
alpha：漸變透明度
scale：漸變尺寸伸縮
translate：畫面變換位置移動
rotate：畫面轉移旋轉移動
set：定義動畫集
1.scale標籤
scale_anim.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"> //動畫持續時間
<scale
android:fromXScale="0.1" //初始X軸的縮放
android:fromYScale="0.1" //初始y軸的縮放
android:toXScale="1.4" //目標x軸的縮放
android:toYScale="1.4" //目標y軸的縮放
android:pivotX="150" //以控件的位置原點座標，動畫開始的起始位置x軸座標
android:pivotY="150"/> //以控件的位置原點座標，動畫開始的起始位置y軸座標
</set>
pivotX有三種數值：
150 直接數字，則是以控件爲原點座標的xy的座標值（150,150），以目標控件爲原點
150% 百分比的，是以控件爲原點座標的，爲控件的寬度的150%的座標，150%那就是控件寬度的150%
150%p 上面同理，但是以父控件的150%
java代碼
startAnimBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//裝載動畫 R.anim.scale_anim 爲動畫位置
Animation scaleAnimation=AnimationUtils.loadAnimation(mContext,R.anim.scale_anim);
//啓動動畫
scaleTV.startAnimation(scaleAnimation);
}
});
效果
2.共同屬性
所有動畫都繼承自Animation類，所以有一些共同的屬性。
android:duration="3000" //動畫持續時間，毫秒單位
android:fillAfter="true" //true動畫結束，保持控件結束時的狀態
android:fillBefore="true"//true動畫結束，保持控件最初始狀態
android:repeatCount="3" //動畫重複次數，infinite表示無限循環
android:repeatMode="restart" //重複的類型，restart表示從頭開始，reverse表示倒序回放
android:interpolator="@android:interpolator/accelerate_cubic" //插值器，控制速度等
看看回放和倒序回放
倒序回放：
android:repeatCount="3"
android:repeatMode="reverse"
回放：
android:repeatCount="3"
android:repeatMode="restart"
3.alpha標籤
<alpha
android:duration="3000" //持續時間
android:fromAlpha="0.1" //初始透明度
android:toAlpha="1"/> //最大透明度 數值在0.0~1.0之間
效果：
4.rotate標籤
<alpha
android:fromAlpha="0.01" //初始角度
android:toAlpha="1"/> //旋轉角度 取值範圍可以爲負值，爲逆時針，正值爲順時針
效果：
5.translate標籤
<translate
android:fromXDelta="50" //以控件爲原座標，x軸加50 爲起始X軸
android:fromYDelta="50" //以控件爲原座標，y軸加50 爲起始y軸
android:toXDelta="400" //目標x軸
android:toYDelta="400" /> //目標y軸
效果：
7.set標籤
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="8000"
android:fillAfter="false"
android:fillBefore="true">
<scale
android:fromXScale="0.1"
android:fromYScale="0.1"
android:pivotX="150"
android:pivotY="150"
android:toXScale="1.4"
android:toYScale="1.4" />
<alpha
android:fromAlpha="0.5"
android:toAlpha="1"/>
<rotate
android:fromDegrees="0.0"
android:toDegrees="360"/>
<translate
android:fromXDelta="50"
android:fromYDelta="50"
android:toXDelta="300"
android:toYDelta="300" />
</set>
效果：
二、視圖動畫代碼實現
0.概述
這些標籤，都對應一個類，但他們都是派生自Animation類。
| scale | ScaleAnimation |
|---|---|
| alpha | AlphaAnimation |
| rotate | RotateAnimation |
| translate | TranslateAnimation |
| set | AetAnimation |
1.ScaleAnimation
四個構造方法來加載scale動畫
ScaleAnimation(Context context, AttributeSet attrs)
ScaleAnimation(float fromX, float toX, float fromY, float toY)
ScaleAnimation(float fromX, float toX, float fromY, float toY,
float pivotX, float pivotY)
ScaleAnimation(float fromX, float toX, float fromY, float toY,
int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)
ScaleAnimation(
float fromX, //初始x軸的縮放
float toX, //目標縮放
float fromY, //初始y軸縮放
float toY, //目標y軸縮放
int pivotXType, float pivotXValue, //以原座標爲原點，x軸的起始點
int pivotYType, float pivotYValue) //以原座標爲原點，y軸的起始點
pivotXType的類型有：
RELATIVE_TO_SELF 百分比，相對自身百分比 50%
RELATIVE_TO_PARENT百分比，相對父控件百分比 50%p
ABSOLUTE具體數值 比如 50
2.AlphaAnimation
AlphaAnimation(Context context, AttributeSet attrs)
AlphaAnimation(float fromAlpha, float toAlpha)
AlphaAnimation(
float fromAlpha, //初始透明度
float toAlpha) //目標透明度
3.RotateAnimation
RotateAnimation(Context context, AttributeSet attrs)
RotateAnimation(float fromDegrees, float toDegrees)
RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY)
RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue,
int pivotYType, float pivotYValue)
RotateAnimation(
float fromDegrees, //初始角度
float toDegrees, //目標角度
int pivotXType, float pivotXValue,
int pivotYType, float pivotYValue)
4.TranslateAnimation
TranslateAnimation(Context context, AttributeSet attrs)
TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)
TranslateAnimation(int fromXType, float fromXValue, int toXType, float toXValue,
int fromYType, float fromYValue, int toYType, float toYValue)
TranslateAnimation(
int fromXType, float fromXValue, //起始x軸座標
int toXType, float toXValue, //目標x軸座標
int fromYType, float fromYValue, //起始y軸座標
int toYType, float toYValue) //目標y軸座標
5.AnimationSet
AnimationSet(Context context, AttributeSet attrs)
AnimationSet(boolean shareInterpolator) //true 共用一個插值器，false 各自定義插值器
都是繼承自Animation，有這些共同屬性
animationSet1.setDuration(3000); //動畫時長
animationSet1.scaleCurrentDuration(4.0f); //當前動畫時間
animationSet1.setFillAfter(true); //true動畫結束，保持控件結束時的狀態
animationSet1.setFillBefore(true); //true動畫結束，保持控件最初始狀態
animationSet1.setRepeatMode(Animation.RESTART); //循環模式
animationSet1.setStartOffset(1000); //在什麼時間停止動畫
animationSet1.setStartTime(500); //在什麼時間開始動畫
animationSet1.setRepeatCount(5); //循環次數
animationSet1.setFillEnabled(true); //true動畫結束，保持控件結束時的狀態
裝載所有動畫效果
ScaleAnimation scaleAnimation1 = new ScaleAnimation(
0.0f,
1.4f,
0.0f,
1.4f,
Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f);
AlphaAnimation alphaAnimation1=new AlphaAnimation(0.1f,0.5f);
RotateAnimation rotateAnimation1=new RotateAnimation(0.1f,0.1f);
TranslateAnimation translateAnimation1=new TranslateAnimation(
Animation.ABSOLUTE,
50,
Animation.ABSOLUTE,
50);
AnimationSet animationSet1=new AnimationSet(true); //裝載
animationSet1.addAnimation(scaleAnimation1);
animationSet1.addAnimation(alphaAnimation1);
animationSet1.addAnimation(rotateAnimation1);
animationSet1.addAnimation(translateAnimation1);
animationSet1.setDuration(3000);
animationSet1.scaleCurrentDuration(4.0f);
animationSet1.setFillAfter(true);
animationSet1.setFillBefore(true);
animationSet1.setRepeatMode(Animation.RESTART);
animationSet1.setStartOffset(1000);
animationSet1.setStartTime(500);
animationSet1.setRepeatCount(5);
animationSet1.setFillEnabled(true);
6.Animation
animationSet1.cancel(); //取消動畫
animationSet1.reset(); //將控件重置到初始化狀態
animationSet1.setAnimationListener(AnimationListener listener); //設置監聽
監聽,利用監聽可以實現動畫的連續效果，比如，先實現縮放，再實現位移
animationSet1.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
//動畫開始
}
@Override
public void onAnimationEnd(Animation animation) {
//動畫結束
}
@Override
public void onAnimationRepeat(Animation animation) {
//動畫結束
}
});
三、基礎插值器
0.概述
控制動畫變化速率的值，就叫插值器，也叫加速器。有Interpolator類來決定。
使用方法
在xml中使用：
android:interpolator="@android:anim/accelerate_interpolator"
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_interpolator"
android:duration="3000"
android:fillAfter="false"
android:fillBefore="true">
</set>
在java代碼中使用;
animationSet1.setInterpolator(new AccelerateInterpolator());
1.系統插值器
系統已經定義了一些常見的插值器
| AccelerateDecelerateInterpolator | @android:anim/accelerate_decelerate_interpolator | 先加速，後減速 |
|---|---|---|
| AccelerateInterpolator | @android:anim/accelerate_interpolator | 開始慢，後一直加速 |
| DecelerateInterpolator | @android:anim/decelerate_interpolator | 開始一瞬間加到最大，後慢慢減慢 |
| LinearInterpolator | @android:anim/linear_interpolator | 勻速加速器 |
| BounceInterpolator | @android:anim/bounce_interpolator | 模擬自由落體回彈的效果 |
| AnticipateInterpolator | @android:anim/anticipate_interpolator | 反方向效果一段時間，再執行正常動畫，如，旋轉。先反旋轉一段距離 |
| OvershootInterpolator | @android:anim/overshoot_interpolator | 動畫結束之後，再執行一段時間 |
| AnticipateOvershootInterpolator | @android:anim/anticipate_overshoot_interpolator | 開始時，反方向效果一段時間，結束時，超過效果時間一段時間 |
| CycleInterpolator(1) | @android:anim/cycle_interpolator | 動畫特定循環播放的次數，速率沿正弦曲線變化 |
四、動畫示例
1.鏡頭由遠及近
控件
<ImageView
android:id="@+id/img"
android:src="@drawable/ali"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
java代碼
ScaleAnimation scaleAnimation=new ScaleAnimation(
0.5f,
1.2f,
0.5f,
1.2f,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
scaleAnimation.setFillAfter(true);
scaleAnimation.setInterpolator(new AccelerateInterpolator());
scaleAnimation.setDuration(6000);
imgIV.startAnimation(scaleAnimation);
效果：
2.加載框效果
<ImageView
android:id="@+id/load"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="30dp"
android:src="@drawable/load" />
RotateAnimation rotateAnimation=new RotateAnimation(
0,
360,
Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
rotateAnimation.setFillAfter(true);
rotateAnimation.setRepeatCount(Animation.INFINITE); //無限循環
rotateAnimation.setInterpolator(new LinearInterpolator()); //勻速
rotateAnimation.setDuration(2000);
loadIV.startAnimation(rotateAnimation);
效果：
編程中我們會遇到多少挫折？表放棄，沙漠盡頭必是綠洲。