Android開發歷程_10(LayoutAnimationController的初步使用)

　　

　　在前面的博文Android開發歷程_8(Tween Animation的2種屬性設置方法)和博文Android開發歷程_9(Frame Animation的使用) 中介紹了Animation的初步使用，但是Tween Animation和Frame Animation的動態效果只適應一個控件，或者說多個控件同時執行一種效果。如果我們需要一個界面中的多個控件按照相同的動畫方式但是每個控件完成該動畫的時刻不同的話，就可采用本節講的LayoutAnimationController來方便的完成了。

　　參考資料為Mars老師的教程，http://www.mars-droid.com/.

 

　　首先我們來看看用java代碼怎么完成該功能，主要遵循以下步驟:

　　在anim下新建一個xml文件，該文件里面設置了控件的動態效果，所以根標簽為set。

　　在java代碼中新建一個Animation對象，采用AnimationUtils.loadAnimation()的方法獲得，該方法有一個輸入參數及anim下的xml文件id。

　　新建一個LayoutAnimationController對象，輸入參數為上一步新建的Animation對象。

　　設置改LayoutAnimationController對象的屬性，比如控件出場的順序(該順序主要有隨機，從頭到尾，反向3種),控件出現的間隔時間等。

　　在布局文件中加載該LayoutAnimationController對象。

 

　　本次實驗是采用了一個線性布局，里面放了一個GridView，GridView里面依次放了7個image圖標和文字。

　　其界面顯示如下：

　　

　　運行的時候，這7個圖標和文字時隨機出現的，且間隔時間設置為0.5s，每個圖標的動作執行時間為0.8s，下一個圖標出現之前並不需要上一個圖標動畫完全完成，所以這2個時間值是不沖突的，也就是說只是控件起始的時刻間隔了0.5s而已。

 

　　實驗主要部分代碼和注釋(附錄有工程code下載鏈接):

MainActivity.java:

package com.example.anim_4;

import java.util.ArrayList;
import java.util.HashMap;

import android.app.Activity;
import android.os.Bundle;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.view.animation.LayoutAnimationController;
import android.widget.GridView;
import android.widget.SimpleAdapter;

public class MainActivity extends Activity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        
        GridView gridview = (GridView) findViewById(R.id.gridview);
        
        ArrayList<HashMap<String,Object>> gridList = new ArrayList<HashMap<String, Object>>();
        HashMap<String,Object> item = new HashMap<String,Object>();
        item.put("img",R.drawable.icon1);
        item.put("str", "One");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon2);
        item.put("str", "Two");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon3);
        item.put("str", "Three");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon4);
        item.put("str", "Four");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon5);
        item.put("str", "Five");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon6);
        item.put("str", "Six");
        gridList.add(item);
        
        item = new HashMap<String,Object>(); 
        item.put("img", R.drawable.icon7);
        item.put("str", "Seven");
        gridList.add(item);       
        
        SimpleAdapter gridAdapter = new SimpleAdapter(this, gridList, R.layout.grid_item, 
                new String[]{"img","str"}, new int[]{R.id.itemImage,R.id.itemText});
        gridview.setAdapter(gridAdapter);
        
        Animation animation = (Animation)AnimationUtils.loadAnimation(MainActivity.this, R.anim.list_anim);
        LayoutAnimationController lac = new LayoutAnimationController(animation);
        lac.setOrder(LayoutAnimationController.ORDER_RANDOM);
        lac.setDelay(0.5f);//注意這個地方是以秒為單位，是浮點型數據，所以要加f
        gridview.setLayoutAnimation(lac);
        
    }

   
}

 

res/anim/文件夾下的xml文件：

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <alpha 
        android:fromAlpha="0.0"
        android:toAlpha="1.0"
        android:duration="800"
        />

</set>

 

activity_main.xml:

<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" >

    <GridView 
        android:id="@+id/gridview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:columnWidth="90dp"
        android:numColumns="2"
        android:stretchMode="columnWidth"
        android:gravity="center"

        />

</LinearLayout>

 

GridView中每個控件的布局xml文件：

<?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_height="wrap_content" 
     android:layout_width="wrap_content">
     <ImageView 
         android:id="@+id/itemImage"
         android:layout_width="100dip" 
         android:layout_height="80dip" 
         android:layout_centerHorizontal="true" 
          />
     <TextView android:layout_width="wrap_content"
         android:layout_below="@+id/itemImage" 
         android:layout_height="wrap_content"
         android:text="TextView01" 
         android:layout_centerHorizontal="true"
         android:id="@+id/itemText" />
 </RelativeLayout>

 

 

　　下面來看看如果不用java代碼，該怎么完成該LayoutAnimationController功能呢？其實步驟很簡單：

　　首先在res下新建一個animator文件夾，里面新建一個xml文件，該xml文件就是對應的LayoutAnimationController屬性設置文件。本次實驗該文件的內容如下：

<?xml version="1.0" encoding="utf-8"?>
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:delay="0.5"
    android:animationOrder="random"
    android:animation="@anim/list_anim"
    />

　　然后在主布局文件activity_main.xml文件的gridview下加入下面一條語句即可：

　　android:layoutAnimation="@animator/list_anim_layout" .

　　當然，java中的如下代碼直接刪除就行了：

Animation animation = (Animation)AnimationUtils.loadAnimation(MainActivity.this, R.anim.list_anim);
LayoutAnimationController lac = new LayoutAnimationController(animation);
lac.setOrder(LayoutAnimationController.ORDER_RANDOM);
lac.setDelay(0.5f);//注意這個地方是以秒為單位，是浮點型數據，所以要加f
gridview.setLayoutAnimation(lac);

 

 

 　　總結：本次實驗主要是練習了LayoutAnimationController的簡單使用方法，完成了一個界面中多個控件的“出場順序”。

 

 

　　 附：實驗工程code下載地址。