1. 程式人生 > >Android佈局動畫簡單使用

Android佈局動畫簡單使用

      這部分內容其實放在檢視動畫中講解比較合適,主要是因為這裡面比較關鍵的一個API LayoutAnimatonController的構建需要的是一個Animation,所以你懂的,更多關於Animation的知識請轉至Android動畫框架之檢視動畫基本使用

      所謂佈局動畫,其實主要還是針對佈局中的子View顯示來說的,也就是當一個ViewGroup中新增一個子View的時候可以通過佈局動畫讓其更加絢麗的新增。下面就來看看具體的實現。

方式1:

通過android:animateLayoutChanges=“true”實現,其效果是預設的一個逐漸顯示的效果

方式2:

通過LayoutAnimationController實現對子View出現順序以及子View自定義動畫顯示

 

因為這部分內容較簡單,我就在一個例子中把兩種方式都展示出來,例子的思想是:在佈局中新增三個按鈕一個TextView,給該佈局新增點選監聽事件,程式執行時為了模擬新增子View,這裡先隱藏這四個子View,通過點選佈局使用第一種方式顯示中心按鈕,給按鈕新增點選事件,觸發第二種方式顯示三個按鈕和TextView。效果圖如下

 

 

LayoutAnimActivity.java程式碼:

package com.hfut.operationanimator;

import android.support.constraint.ConstraintLayout;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.AnimationSet;
import android.view.animation.LayoutAnimationController;
import android.view.animation.RotateAnimation;
import android.view.animation.ScaleAnimation;
import android.widget.Button;
import android.widget.TextView;

/**
 * @author why
 * @date 2018-9-9 22:43:26
 */
public class LayoutAnimActivity extends AppCompatActivity {

    ConstraintLayout layout;
    Button centerButton;
    Button button1;
    Button button2;
    TextView textView;

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

        textView = findViewById(R.id.test_view);
        centerButton = findViewById(R.id.center_button);
        button1 = findViewById(R.id.button1);
        button2 = findViewById(R.id.button2);
        layout = findViewById(R.id.view_group);

        textView.setVisibility(View.INVISIBLE);
        centerButton.setVisibility(View.INVISIBLE);
        button1.setVisibility(View.INVISIBLE);
        button2.setVisibility(View.INVISIBLE);

        layout.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                centerButton.setVisibility(View.VISIBLE);

            }
        });
    }

    public void layoutAnim(View view){
        textView.setVisibility(View.VISIBLE);
        button1.setVisibility(View.VISIBLE);
        button2.setVisibility(View.VISIBLE);

        ScaleAnimation scaleAnimation = new ScaleAnimation(0, 1, 0, 1);
        RotateAnimation rotateAnimation=new RotateAnimation(0,360);
        rotateAnimation.setDuration(4000);
        scaleAnimation.setDuration(4000);

        AnimationSet set=new AnimationSet(true);
        set.addAnimation(rotateAnimation);
        set.addAnimation(scaleAnimation);

        LayoutAnimationController controller = new LayoutAnimationController(set, 0.5f);
        //子View出現的順序可以為
        //LayoutAnimationController.ORDER_NORMAL;
        //LayoutAnimationController.ORDER_REVERSE
        //LayoutAnimationController.ORDER_RANDOM
        controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
        layout.setLayoutAnimation(controller);
    }
}

 

activity_layout_anim.xml程式碼:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:animateLayoutChanges="true"
    android:id="@+id/view_group"
    tools:context="com.hfut.operationanimator.LayoutAnimActivity">

    <Button
        android:textSize="20sp"
        android:text="中心按鈕"
        android:onClick="layoutAnim"
        android:id="@+id/center_button"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <Button
        android:text="按鈕1"
        android:id="@+id/button1"
        android:layout_marginLeft="80dp"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@id/button2"
        app:layout_constraintBottom_toTopOf="@+id/center_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <Button
        android:text="按鈕2"
        android:id="@+id/button2"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="@id/button1"
        app:layout_constraintBottom_toTopOf="@+id/center_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />


    <TextView
        android:id="@+id/test_view"
        android:layout_marginTop="20dp"
        app:layout_constraintTop_toBottomOf="@id/center_button"
        android:gravity="center_horizontal"
        android:textColor="@color/colorAccent"
        android:text="佈局動畫演示"
        android:textSize="35dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</android.support.constraint.ConstraintLayout>

到這裡,關於佈局動畫簡單使用就介紹完了。如果還想了解關於屬性動畫的使用請轉至屬性動畫之Animator API基本使用