Android小記:ViewStub的使用

ViewStub

    在介紹ViewStub之前，可以先了解一下<include/>標籤，這是一個把其它佈局資源包含進某個特定的佈局中，在很多平臺的開發中，都有類似的概念，這樣好處就不用細說了，主要是可以在不同的文件中編輯界面的佈局控件。 

    ViewStub，惰性裝載控件。ViewStub是一個無形的、零大小的視圖，可以在程序運行的過程中，通過懶加載的模式inflate進佈局資源中。當一個ViewStub的inflate()方法被調用或者被設爲顯示時，這個ViewStub使用設定的View纔會被加載，並替換當前ViewStub的位置。因此，ViewStub存在於視圖層次，直到setVisibility(int)或inflate()方法被調用，否則是不加載控件的，所以消耗的資源小。通常也叫它爲“懶惰的include”。 

    ViewStub的好處是，在某些場景中，並不一定需要把所有的內容都展示出來，可以隱藏一些View視圖，待用戶需要展示的時候再加載到當前的Layout中，這個時候就可以用到ViewStub這個控件了，這樣可以減少資源的消耗，使最初的加載速度變快。 

    在ViewStub中，需要用到的屬性也就兩個，Android也爲其提供了相應的getter/setter方法： 

android:inflateId：重寫ViewStub的父佈局控件的Id。

android:layout：設置ViewStub被inflate的佈局控件Id。 

對於ViewStub而言，它需要監聽的事件就只有一個，被加載的時候觸發的事件

VIewStub.OnInflateListener，在這個事件中，需要實現一個onInflate()方法，以下是這個方法的簽名： 

onInflate(ViewStub stub, View inflated); 

在VIewStub.OnInflateListener事件的onInflate()方法中，stub爲當前待膨脹的ViewStub控件，inflated參數爲當前被膨脹的View視圖，可以在其中對其進行一些額外的操作。 

在使用ViewStub的過程中，有一點需要特別注意。對於一個ViewStun而言，當setVisibility(int)或inflate()方法被調用之後，這個ViewStub在佈局中將被使用指定的View替換，所以inflate過一遍的ViewStub，如果被隱藏之後再次想要顯示，將不能使用inflate()方法，但是可以再次使用setVisibility(int)方法設置爲可見，這就是這兩個方法的區別。而inflate()被調用之後，返回的是父佈局控件對象。

示例Demo 

下面通過一個Demo講解一下上面提到的內容。在這個Demo中，會簡單的使用到<include/>標籤，還定義一個ViewStub控件，用於加載一個RatingBar，提供按鈕加載與隱藏這個RatingBar，最後提供一個按鈕用於操作動態加載的Ratingbar。 

<strong><span style="font-size:14px;">定義的被inflate的控件代碼：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <RatingBar
        android:id="@+id/ratingBar1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</LinearLayout>

佈局代碼： 
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <!-- 使用include標籤加載一個id爲start的控件 -->

    <include
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        layout="@layout/start" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#FFCCDD"
        android:orientation="vertical" >

        <! />

        <ViewStub
            android:id="@+id/stub"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:inflatedId="@+id/inflatedStart"
            android:layout="@layout/start" />
    </LinearLayout>

    <Button
        android:id="@+id/btn1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="動態添加布局" />

    <Button
        android:id="@+id/btn2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="動態隱藏佈局" />

    <Button
        android:id="@+id/btn3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="操作StubInflate的控件" />

</LinearLayout>
</span></strong>

<strong><span style="font-size:14px;">實現代碼： 
package com.bgxt.viewstubdemo;

import android.os.Bundle;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewStub;
import android.view.ViewStub.OnInflateListener;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.RatingBar;
import android.widget.Toast;

public class MainActivity extends Activity {
	private Button btn1, btn2, btn3;
	private ViewStub viewStub;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		// 獲取控件，綁定事件
		btn1 = (Button) findViewById(R.id.btn1);
		btn2 = (Button) findViewById(R.id.btn2);
		btn3 = (Button) findViewById(R.id.btn3);
		viewStub = (ViewStub) findViewById(R.id.stub);
		viewStub.setOnInflateListener(inflateListener);
		btn1.setOnClickListener(click);
		btn2.setOnClickListener(click);
		btn3.setOnClickListener(click);
	}

	private OnInflateListener inflateListener = new OnInflateListener() {
		@Overrid
		public void onInflate(ViewStub stub, View inflated) {
			// inflaye ViewStub的時候顯示
			Toast.makeText(MainActivity.this, "ViewStub is loaded!",
					Toast.LENGTH_SHORT).show();
		}
	};
	private View.OnClickListener click = new OnClickListener() {
		@Override
		public void onClick(View v) {
			switch (v.getId()) {
			case R.id.btn1:
				try {
					// 如果沒有被inflate過，使用inflate膨脹
					LinearLayout layout = (LinearLayout) viewStub.inflate();
					RatingBar bar = (RatingBar) layout
							.findViewById(R.id.ratingBar1);
					bar.setNumStars(4);
				} catch (Exception e) {
					// 如果使用inflate膨脹報錯，就說明已經被膨脹過了，使用setVisibility方法顯示
					viewStub.setVisibility(View.VISIBLE);
				}
				break;
			case R.id.btn2:
				// 隱藏ViewStub
				viewStub.setVisibility(View.GONE);
				break;
			case R.id.btn3:

				// 操作被inflate的控件，需要得到當前佈局的對象
				// 然後通過這個對象去找到被inflate的控件。
				// 因爲否則在這個示例中，會找到include標籤引入的控件
				LinearLayout linearLayout = (LinearLayout) findViewById(R.id.inflatedStart);
				RatingBar rBar = (RatingBar) linearLayout
						.findViewById(R.id.ratingBar1);
				float numStart = rBar.getRating();
				numStart++;
				if (numStart > 4) {
					numStart = 0;
				}
				rBar.setRating(numStart);
				break;
			}
		}
	};

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}
}</span></strong>

ViewStub的使用示例

MainACtivity.java:

/** 

 * Demo描述: 利用ViewStub顯示和隱藏佈局 

 * ViewStub的引入: 

 * 在開發的時候,有些佈局是要根據條件而動態顯示,達到一個佈局兩用的效果, 

 * 運用View.VISIBLE和View.GONE去改變佈局的可見性. 

 * 這樣的做法顯然是沒什麼多大的問題,優點邏輯清晰,控制靈活,但缺點就是耗費資源 

 * 在setContentView()或者用inflate加載佈局文件時無論View是否 

 * 被設置爲View.GONE和View.VISIBLE,都會創建對象,佔用一定程度上的內存,所以在考慮優化程序的時候， 

 * 儘量避免資源浪費，降低程序的資源佔有量，提高響應速度，提升軟件的用戶體驗 

 *  

 * 推薦的做法是使用android.view.ViewStub. 

 * ViewStub是一個輕量級的View,它一個看不見的,不佔佈局位置,佔用資源非常小的控件. 

 * ViewStub是一個隱藏的,不佔用內存空間的視圖對象,它可以在運行時延遲加載佈局資源文件當 ViewStub可見,或者調用 

 * inflate()函數時,纔會加載這個佈局資源文件 注意的問題: ViewStub只能用來Inflate一個佈局文件,而不是某個具體的View 

 *  

 * 遇到的問題:  

 * 報錯 ViewStub must have a non-null ViewGroup viewParent  

 * 原因: 

 * 官方文檔:viewstub不能反覆inflate,只能inflate一次 

 */  

<strong><span style="font-size:18px;">public class MainActivity extends Activity {  
    private Button mButton_show;  
    private Button mButton_hidden;  
    private ViewStub mViewStub;  
    private View mView=null;  
    private boolean isInflate=true;  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
        init();  
    }  
    private void init(){  
        mButton_show=(Button) findViewById(R.id.button_show);  
        mButton_show.setOnClickListener(new ButttonClickListenerImpl());  
        mButton_hidden=(Button) findViewById(R.id.button_hidden);  
        mButton_hidden.setOnClickListener(new ButttonClickListenerImpl());  
        mViewStub=(ViewStub) findViewById(R.id.viewStub);  
    }  
  
    private class ButttonClickListenerImpl implements OnClickListener {  
        public void onClick(View v) {  
            switch (v.getId()) {  
            case R.id.button_show:  
                if (isInflate) {  
                    mView=mViewStub.inflate();  
                    isInflate=false;  
                }else {  
                    mView.setVisibility(View.VISIBLE);  
                }  
                TextView textView=  
                (TextView) mView.findViewById(R.id.viewStub_TextView);  
                textView.setText("time="+System.currentTimeMillis());  
                break;  
            case R.id.button_hidden:  
                mViewStub.setVisibility(View.GONE);  
                break;  
            default:  
                break;  
            }  
        } 
    }  
}  
 
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"   >  
   <LinearLayout  
    android:layout_width="wrap_content"  
    android:layout_height="wrap_content"   >  
     <ViewStub   
         android:id="@+id/viewStub"  
         android:layout_width="wrap_content"  
         android:layout_height="wrap_content"   
         android:layout="@layout/testviewstublayout"   />  
   </LinearLayout>  
   <Button   
       android:id="@+id/button_show"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"   
       android:text="加載ViewStub"  />  
   <Button   
       android:id="@+id/button_hidden"  
       android:layout_width="wrap_content"  
       android:layout_height="wrap_content"   
       android:text="隱藏ViewStub"  />  
</LinearLayout>  
testviewstublayout.xml.xml如下: 
<?xml version="1.0" encoding="utf-8"?>  
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:orientation="vertical" >  
    <TextView   
        android:id="@+id/viewStub_TextView"  
        android:layout_width="wrap_content"  
        android:layout_height="wrap_content"  
        android:text="test test test" />  
</LinearLayout>  </span><span style="font-size: 14px;">
</span></strong>