(二)进阶练习____10、创建向下兼容UI——演示如何使用版本识别组件

负责人：ziggurat

原文链接：http://docs.eoeandroid.com/training/backward-compatible-ui/using-component.html

目录

 [隐藏] 

• 1 演示如何使用版本识别组件
  • 1.1 添加切换逻辑
  • 1.2 创建一个版本识别的Activity Layout
  • 1.3 在Activity中使用TabHelper

演示如何使用版本识别组件

我们有CompatTab和TabHelper的两个实现类了，一个用在Android 3.0或者更新的版本的APIs中，另一个用在早期的版本中，现在我们开始使用这两个类。这节课我们将讨论如何创建这两个实现类的切换逻辑，创建可以做到版本识别的布局，并最终使用这些向后兼容的UI组件。

添加切换逻辑

基于当前的设备版本，TabHelper抽象类扮演着创建TabHelper和CompatTab实例工厂的角色： 

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 mTabHelper.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);
        }
    }
    ...
}

创建一个版本识别的Activity Layout

下一步是在你的Activity中提供两个分别支持两种标签实现方式的布局，对于老版本（TabHelperEclair）的实现方式，我们需要在布局中包含TabWidget和TabHost，作为tab中内容的容器。

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来放置tab的内容，因为tab的指示器是由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选择实现类的逻辑是相同的。

在Activity中使用TabHelper

在Activity的onCreate()方法里，我们可以获得一TabHelper对象，然后添加标签，代码如下： 

@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相应的对象。实际中使用的类对于Activity来讲是透明的，因为他们都是来自共同的接口TabHelper.

下边是运行在Android 2.3和Android 4.0设备上的两张截图：

 

图1：运行在Android 2.3设备上(使用TabHelperEclair)和Android 4.0设备上(使用TabHelperHoneycomb)具有向后兼容的tab的截图