使用可因應不同版本的元件

您現在有 TabHelper 和 CompatTab 的兩種實作方式，分別適用於 Android 3.0 以上版本和舊版平台，接下來就要運用這些實作方式。本課程將討論如何建立邏輯，在這些實作項目之間切換、建立可感知版本的版面配置，以及最後使用可回溯相容的 UI 元件。

新增切換邏輯

TabHelper 抽象類別會做為工廠，根據目前裝置的平台版本建立適用於該版本的 TabHelper 和 CompatTab 執行個體：

Kotlin

sealed class TabHelper(protected val mActivity: FragmentActivity, protected val tag: String) {

    abstract fun setUp()

    abstract fun addTab(tab: CompatTab)

    // Usage is tabHelper.newTab("tag")
    fun newTab(tag: String): CompatTab =
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
                CompatTabHoneycomb(mActivity, tag)
            } else {
                CompatTabEclair(mActivity, tag)
            }

    companion object {
        // Usage is TabHelper.createInstance(activity)
        fun createInstance(activity: FragmentActivity): TabHelper =
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
                    TabHelperHoneycomb(activity)
                } else {
                    TabHelperEclair(activity)
                }
    }
}

Java

public abstract class TabHelper {
    ...
    // Usage is TabHelper.createInstance(activity)
    public static TabHelper createInstance(FragmentActivity activity) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
            return new TabHelperHoneycomb(activity);
        } else {
            return new TabHelperEclair(activity);
        }
    }

    // Usage is tabHelper.newTab("tag")
    public CompatTab newTab(String tag) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
            return new CompatTabHoneycomb(mActivity, tag);
        } else {
            return new CompatTabEclair(mActivity, tag);
        }
    }
    ...
}

建立可感知版本的活動版面配置

下一步是為活動提供版面配置，支援這兩種分頁實作方式。如果是舊版實作方式 (TabHelperEclair)，請務必確保活動版面配置包含 TabWidget 和 TabHost，以及用於放置分頁內容的容器：

res/layout/main.xml：

<!-- This layout is for API level 5-10 only. -->
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="5dp">

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1" />

    </LinearLayout>
</TabHost>

如要導入 TabHelperHoneycomb，您只需要一個 FrameLayout 來包含分頁內容，因為分頁指標是由 ActionBar 提供：

res/layout-v11/main.xml：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabcontent"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

在執行階段，Android 會根據平台版本，決定要膨脹哪個版本的 main.xml 版面配置。這與上一節中判斷要使用哪種 TabHelper 實作方式的邏輯相同。

在活動中使用 TabHelper

在活動的 onCreate() 方法中，您可以取得 TabHelper 物件，並使用下列程式碼新增分頁：

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
    ...
    setContentView(R.layout.main)

    TabHelper.createInstance(this).apply {
        setUp()

        newTab("photos")
                .setText(R.string.tab_photos)
                .also { photosTab ->
                    addTab(photosTab)
                }

        newTab("videos")
                .setText(R.string.tab_videos)
                .also { videosTab ->
                    addTab(videosTab)
                }
    }
}

Java

@Override
public void onCreate(Bundle savedInstanceState) {
    setContentView(R.layout.main);

    TabHelper tabHelper = TabHelper.createInstance(this);
    tabHelper.setUp();

    CompatTab photosTab = tabHelper
            .newTab("photos")
            .setText(R.string.tab_photos);
    tabHelper.addTab(photosTab);

    CompatTab videosTab = tabHelper
            .newTab("videos")
            .setText(R.string.tab_videos);
    tabHelper.addTab(videosTab);
}

執行應用程式時，這段程式碼會擴充正確的活動版面配置，並例項化 TabHelperHoneycomb 或 TabHelperEclair 物件。由於具體類別共用 TabHelper 介面，因此活動實際使用的具體類別對活動而言是不透明的。

以下兩張螢幕截圖顯示這項實作在 Android 2.3 和 Android 4.0 裝置上執行的情況。

圖 1. 以下是回溯相容分頁在 Android 2.3 裝置 (使用 TabHelperEclair) 和 Android 4.0 裝置 (使用 TabHelperHoneycomb) 上執行的螢幕截圖範例。