Fragment對於Android開發來說，是一個必不可少的工具，我們使用這個工具可以輕鬆應對很多介面管理上的問題，例如如何分屏，如何移除介面和替換介面等。更為神奇的是，我們可以結合Android系統的特性和Fragment來實現一個工程適應手機平板兩種螢幕。當然這需要我們在程式碼中進行一點判斷。現在，通過下面這個例子我們來了解一下如何用同一個工程來適應手機和平板的。

      首先，我們需要看一下目錄結構，這次的目錄結構要比前兩次的目錄複雜一些。主要原因是這次除了需要主Activity的佈局之外還需要Fragment的佈局。

       要看出平板和手機的效果需要兩個Fragment，這樣如果是手機的話就會從一個Fragment跳轉到另一個Fragment，如果是平板的話就會在同一個螢幕上顯示出兩個Fragment。

       這裡實現依賴Android系統的限定符，也就是類似layout-land的形式，“-”後面跟的就是限定符，限定符是用來提示系統需要載入內容的，比如這裡，如果是橫向的螢幕時就會載入這裡的佈局檔案。

      接下來奉上詳細程式碼，因為是手機和平板兩個版本，所以會有兩個Activity佈局。

手機版佈局：

<FrameLayout 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" >
    
    <!-- 裝載列表的Fragment 的容器 -->
    <LinearLayout 
        android:id="@+id/list_container"
        android:orientation="vertical"
        android:layout_width="match_parent"
  		android:layout_height="match_parent">
    </LinearLayout>
    
    
    <!-- 裝載詳情的Fragment 的容器 -->
    <LinearLayout 
        android:id="@+id/detail_container"
        android:orientation="vertical"
        android:layout_width="match_parent"
  	android:layout_height="match_parent">
    </LinearLayout>

</FrameLayout>
 

      這是在一個FrameLayout下放置了兩個LinearLayout，分別用來裝載兩個Fragment。

平板版佈局

<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" >
    
    <!-- 裝載列表的Fragment 的容器 -->
    <LinearLayout 
        android:id="@+id/list_container"
        android:orientation="vertical"
        android:layout_width="match_parent"
  	android:layout_height="match_parent"
  	android:layout_weight="2">
    </LinearLayout>
    
    
    <!-- 裝載詳情的Fragment 的容器 -->
    <LinearLayout 
        android:id="@+id/detail_container"
        android:orientation="vertical"
        android:layout_width="match_parent"
  	android:layout_height="match_parent"
  	android:layout_weight="1">
    </LinearLayout>

</LinearLayout>
 

        可能有人覺得這裡乍一看，兩個佈局沒什麼區別啊。但是，請不要乍一看就下結論，這裡其實是有區別的，而且是比較大的區別，看根標籤就能看出來，手機版的是一個FrameLayout，而平板版的佈局是一個LinearLayout。而且平板佈局是有分權重的。這就是列表和詳情頁所佔螢幕比例不同的原因。

       好了有了佈局之後就可以寫Activity部分的內容了。接下來看Activity的程式碼。

package com.example.fragmentdemo;

import com.example.fragmentdemo3.R;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;

public class MainActivity extends FragmentActivity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		//建立一個左側列表的Fragment
		Fragment listFragment = new FragmentLeft();
		
		//得到一個管理器，用來管理Fragment
		FragmentManager fragmentManager = getSupportFragmentManager();
		//用FragmentManager開啟一個Fragment事務
		FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
		//把剛建立的列表放到列表容器裡
		fragmentTransaction.add(R.id.list_container, listFragment);
		
		//記得提交
		fragmentTransaction.commit();
	}	

}

       Activity裡的程式碼十分簡單，不過需要注意的是這裡繼承的不是普通的Activity，而是一個FragmetActivity，接下來和普通的Activity一樣，我們需要為Activity設定佈局檔案，設定完成佈局檔案之後就是，管理在這個Activity上的Fragment了。先新建一個Fragment，然後得到一個Fragment的管理器。得到管理器之後還需要開啟一個Fragment的事務，聽起來似乎有些麻煩，但實際上程式碼就那麼幾行。

      最後用add方法把剛才建立的列表Fragment裝到列表容器裡，也就是佈局檔案裡的Layout裡。提交事務就即可。

      只有一個Fragment是看不出效果的，需要建立兩個才行，否則螢幕是一個，Fragment也是一個，無法判斷手機螢幕是否跳轉，平板螢幕是否分屏。

      所以，接下來，建立兩個Fragment，大家都知道，Fragment也是有自己佈局的，實際上Fragment和一個小型的Fragment差不多，Fragment也有自己的生命週期。

剛才Activity裡用到了列表頁的Fragment，我們先看列表頁的Fragment。

package com.example.fragmentdemo;

import java.util.ArrayList;
import java.util.List;

import com.example.fragmentdemo3.R;

import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentManager.OnBackStackChangedListener;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;

/**
 * 
 * @author yufc
 *
 */
public class FragmentLeft extends Fragment {
	
	private List<String> leftList = new ArrayList<String>();


	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		return inflater.inflate(R.layout.fragment_left_layout, container, false);
	}
	
	
	@Override
	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
		
		//左側ListView
		for(int i=0, count=20; i<count; i++){
			leftList.add("這是第" + i+"條資料");
		}
		
		//取到ListView
		ListView listView = (ListView) getActivity().findViewById(R.id.fragment_list);
		listView.setAdapter(new ArrayAdapter(getActivity(), android.R.layout.simple_list_item_1, leftList));
		
		listView.setOnItemClickListener(new OnItemClickListener() {

			@Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				//得到一個新的Fragment，作為右側的Fragment
				Fragment rightFragment = new FragmentRight();
				
				//傳遞顯示資料
				Bundle mBundle = new Bundle();
				mBundle.putString("arg", leftList.get(position));
				rightFragment.setArguments(mBundle);
				
				//建立一個Fragment的管理器
				final FragmentManager fragmentManager = getActivity().getSupportFragmentManager();
				final FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
				
				//判斷橫豎屏
				Configuration configuration = getActivity().getResources().getConfiguration();
				int ori = configuration.orientation;
				
				fragmentTransaction.replace(R.id.detail_container, rightFragment);
				
				//這裡是為了讓Fragment可以回退，不至於直接退出Activity
				if(ori == configuration.ORIENTATION_PORTRAIT){
					fragmentTransaction.addToBackStack(null);
				}
				
				fragmentTransaction.commit();
				
				
			}
		});
		
	}
	
	/**
	 * 
	 * @param msg
	 */
	private void showTost(String msg){
		Toast.makeText(getActivity(), msg, Toast.LENGTH_LONG).show();
	}

}

當然少不了為這個Fragment寫一個佈局

<?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:background="#ff00ff99"
    android:orientation="vertical" >

    <ListView
        android:id="@+id/fragment_list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:cacheColorHint="@android:color/transparent"
        android:fadingEdge="none" >
    </ListView>

</LinearLayout>

    這裡Java程式碼有點長，但並不難理解。既然要建立一個Fragment，與要建立一個Activity的思路是相似的，建立Activity需要繼承Activity類，同樣建立一個Fragment需要繼承Fragment類。之後需要複寫Fragment的方法，這裡複寫的是onCreateView方法，在這個方法裡需要對Fragment的佈局初始化。方法就是用inflate方法。Fragment的生命週期是繫結在Activity上的，所以還需要複寫一個OnActivityCreate方法，當Activity建立時進行一些必要的操作。
     在OnActivityCreate方法裡，需要得到佈局檔案裡的ListView，顯示內容，設定一些資料也是必要的，這裡只是用一個迴圈設定了一些資料，用一個最簡單的Adapter來裝載這些資料。接下來設定ListView的點選事件，點選完列表的條目之後自然是要顯示詳情，這裡和Activity裡相似，建立詳情Fragment。這裡不再贅述。

     相對來說詳情Fragment就要簡單多了。和列表相比簡單到幾乎沒有什麼內容，只是簡單的得到列表頁裡傳來的資料，顯示出來而已。下面是詳情Fragment的程式碼。

詳情Fragment的Layout

<?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"
    android:background="#ff006600" >

    <ListView
        android:id="@+id/fragment_detail"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:cacheColorHint="@android:color/transparent"
        android:fadingEdge="none" >
    </ListView>

</LinearLayout>

也是LinearLayout下有一個ListView。

然後是Java程式碼

package com.example.fragmentdemo;

import java.util.ArrayList;
import java.util.List;

import com.example.fragmentdemo3.R;

import android.content.res.Configuration;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.LinearLayout;
import android.widget.ListView;

/**
 * 
 * @author yufc
 *
 */
public class FragmentRight extends Fragment {

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		return inflater.inflate(R.layout.fragment_right_layout, container, false);
	}
	
	
	@Override
	public void onActivityCreated(Bundle savedInstanceState) {
		super.onActivityCreated(savedInstanceState);
		
		//取出前一個Fragment傳來的資料
		Bundle bundle = getArguments();
		String data = bundle.getString("arg");
		
		List<String> list = new ArrayList<String>();
		for(int i=0, count=20; i<count; i++){
			list.add(data);
		}
		
		LinearLayout layout = (LinearLayout) getActivity().findViewById(R.id.detail_container);
		
		ListView listView = (ListView) getActivity().findViewById(R.id.fragment_detail);
		listView.setAdapter(new ArrayAdapter(getActivity(), android.R.layout.simple_list_item_1, list));
		
		
	
	}

}

好了，大致就是這個樣子了。

下面是Manifest檔案

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.fragmentdemo3"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="16" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="com.example.fragmentdemo.MainActivity"
            android:label="@string/app_name" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>