1. 程式人生 > >Android三種動畫之(二)補間動畫

Android三種動畫之(二)補間動畫

介紹說明:補間動畫是一種定義開始狀態和結束狀態,其中播放的時候還能新增設定的一種動畫,它的動畫方式有平移(TranslateAnimation)、縮放(ScaleAnimation)、旋轉(RotateAnimation)、透明度(AlphaAnimation)四個子類,四種變化,也可以將這四種動畫結合起來一起使用set

 TweenAnimation補間動畫的動畫分類

alph 透明度漸變效果動畫
scale 縮大縮小漸變效果動畫
translate 平移效果動畫
rotate 旋轉效果動畫

TweenAnimation的屬性:

java方法 xml屬性 效果
setDuration(long) android:duration 動畫持續時間,毫秒為單位
setFillAfter(boolean) android:fillAfter 控制元件動畫結束時是否保持動畫最後的狀態
setFillBefore(boolean) android:fillBefore 控制元件動畫結束時是否還原到開始動畫前的狀態
setFillEnabled(boolean) android:fillEnabled 與android:fillBefore效果相同
setRepeatCount(int) android:repeatCount 重複次數
setDetachWallpaper(boolean) android:detachWallpaper 是否在桌布上執行
setInterpolator(Interpolator) android:interpolator 設定插值器(指定的動畫效果,譬如回彈等)
setRepeatMode(int) android:repeatMode 重複型別有兩個值,reverse表示倒序回放,restart表示從頭播放
setZAdjustment(int) android:zAdjustment 表示被設定動畫的內容執行時在Z軸上的位置(top/bottom/normal),預設為normal
setStartOffset(long) android:startOffset 呼叫start函式之後等待開始執行的時間,單位為毫秒

 

Alpha(漸變)屬性詳解

java方法 xml屬性 效果
AlphaAnimation(float fromAlpha, …) android:fromAlpha 動畫開始的透明度(0.0到1.0,0.0是全透明,1.0是不透明)
AlphaAnimation(…, float toAlpha) android:toAlpha 動畫結束的透明度(0.0到1.0,0.0是全透明,1.0是不透明)

使用方法1:在xml程式碼裡面設定

在res資料夾下建立anim資料夾代表存放動畫資源,在anim資料夾下建立tween_animation.xml檔案,命名無要求,示例程式碼: 

<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="2000"
    android:fromAlpha="1.0"
    android:toAlpha="0.0"/>
<!-- android:duration="2000" 代表動畫播放的時間,是四種動畫公共的屬性-->
<!-- android:fromAlpha="1.0" 和 android:toAlpha="0.0" 是動畫自己的屬性-->

然後在程式碼中使用這個動畫資源

Animation animation = AnimationUtils.loadAnimation(this, R.anim.tween_animation);
mIvFrame.startAnimation(animation);

 

使用方法2:在java程式碼中設定

AlphaAnimation animation=new AlphaAnimation(1,0);//建立動畫並設定動畫屬性
animation.setDuration(2000);//公共屬性--動畫播放時間
mIvFrame.startAnimation(animation);//使用動畫

 

 

Rotate(旋轉)屬性詳解

java方法 xml屬性 效果
RotateAnimation(float fromDegrees, …) android:fromDegrees 旋轉開始角度,正代表順時針度數,負代表逆時針度數
RotateAnimation(…, float toDegrees, …) android:toDegrees 旋轉結束角度,正代表順時針度數,負代表逆時針度數
RotateAnimation(…, float pivotX, …) android:pivotX 縮放起點X座標(數值、百分數、百分數p,譬如50表示以當前View左上角座標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控制元件寬高的50%做為初始點)
RotateAnimation(…, float pivotY) android:pivotY 縮放起點Y座標,同上規律

 

Scale(縮放)屬性詳解

java方法 xml屬性 效果
ScaleAnimation(float fromX, …) android:fromXScale 初始X軸縮放比例,1.0表示無變化
ScaleAnimation(…, float toX, …) android:toXScale 結束X軸縮放比例
ScaleAnimation(…, float fromY, …) android:fromYScale 初始Y軸縮放比例
ScaleAnimation(…, float toY, …) android:toYScale 結束Y軸縮放比例
ScaleAnimation(…, float pivotX, …) android:pivotX 縮放起點X軸座標(數值、百分數、百分數p,譬如50表示以當前View左上角座標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控制元件寬高的50%做為初始點)
ScaleAnimation(…, float pivotY) android:pivotY 縮放起點Y軸座標,同上規律

 

Translate(平移)屬性詳解

java方法 xml屬性 效果
TranslateAnimation(float fromXDelta, …) android:fromXDelta 起始點X軸座標(數值、百分數、百分數p,譬如50表示以當前View左上角座標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控制元件寬高的50%做為初始點)
TranslateAnimation(…, float fromYDelta, …) android:fromYDelta 起始點Y軸從標,同上規律
TranslateAnimation(…, float toXDelta, …) android:toXDelta 結束點X軸座標,同上規律
TranslateAnimation(…, float toYDelta) android:toYDelta 結束點Y軸座標,同上規律
     

 放出程式碼;

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">
    <LinearLayout
        android:layout_weight="1"
        android:layout_width="match_parent"
        android:gravity="center"
        android:orientation="vertical"
        android:layout_height="match_parent">
        <ImageView
            android:id="@+id/iv_frame"
            android:src="@mipmap/ic_launcher"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:orientation="horizontal"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/alphaanimation"
            android:layout_width="wrap_content"
            android:text="漸變"
            android:background="@color/colorAccent"
            android:textColor="#fff"
            android:padding="10dp"
            android:layout_margin="10dp"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/scaleanimation"
            android:layout_width="wrap_content"
            android:text="縮放"
            android:background="@color/colorAccent"
            android:textColor="#fff"
            android:padding="10dp"
            android:layout_margin="10dp"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/translateanimation"
            android:layout_width="wrap_content"
            android:text="平移"
            android:background="@color/colorAccent"
            android:textColor="#fff"
            android:padding="10dp"
            android:layout_margin="10dp"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/rotateanimation"
            android:layout_width="wrap_content"
            android:text="旋轉"
            android:background="@color/colorAccent"
            android:textColor="#fff"
            android:padding="10dp"
            android:layout_margin="10dp"
            android:layout_height="wrap_content" />

        <TextView
            android:id="@+id/setanimation"
            android:layout_width="wrap_content"
            android:text="組合動畫"
            android:background="@color/colorAccent"
            android:textColor="#fff"
            android:padding="10dp"
            android:layout_margin="10dp"
            android:layout_height="wrap_content" />
    </LinearLayout>

</LinearLayout>

MainActivity裡面的程式碼

package com.example.administrator.animation;

import android.annotation.SuppressLint;
import android.graphics.drawable.AnimationDrawable;
import android.graphics.drawable.Drawable;
import android.support.v7.app.AppCompatActivity;
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.AnimationUtils;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.view.animation.TranslateAnimation;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private ImageView mIvFrame;
    private TextView mOne, mTwo, mThree, mFour,mFive;
    private AlphaAnimation alpha;
    private ScaleAnimation scale;
    private RotateAnimation rotate;
    private TranslateAnimation translate;
    private AnimationSet set;

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

    public void initView() {
        mIvFrame = findViewById(R.id.iv_frame);
        mOne = findViewById(R.id.alphaanimation);
        mTwo = findViewById(R.id.scaleanimation);
        mThree = findViewById(R.id.translateanimation);
        mFour = findViewById(R.id.rotateanimation);
        mFive=findViewById(R.id.setanimation);
        mOne.setOnClickListener(this);
        mTwo.setOnClickListener(this);
        mThree.setOnClickListener(this);
        mFour.setOnClickListener(this);
        mFive.setOnClickListener(this);
        alpha=new AlphaAnimation(1,0);//建立動畫並設定動畫屬性
        alpha.setDuration(2000);//公共屬性--動畫播放時間

        scale=new ScaleAnimation(0,2,0,2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        scale.setDuration(2000);

        translate = new TranslateAnimation(0,500,0,500);
        translate.setDuration(2000);

        rotate = new RotateAnimation(0,270,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
        rotate.setDuration(2000);

        set=new AnimationSet(true);
        set.addAnimation(alpha);
        set.addAnimation(scale);
        set.addAnimation(rotate);
        set.addAnimation(translate);
    }


    @Override
    public void onClick(View view) {
        switch (view.getId()) {

            case R.id.alphaanimation:
                mIvFrame.startAnimation(alpha);//使用動畫
                break;

            case R.id.scaleanimation:
                mIvFrame.startAnimation(scale);//使用動畫
                break;

            case R.id.translateanimation:
                mIvFrame.startAnimation(translate);//使用動畫
                break;
            case R.id.rotateanimation:
                mIvFrame.startAnimation(rotate);//使用動畫
                break;

            case R.id.setanimation:
                mIvFrame.startAnimation(set);//使用動畫
                break;
        }
    }
}

下載地址:https://download.csdn.net/download/lanrenxiaowen/10755780