TabHost、TabWidgt、Tabcontent之间的关系

最新推荐文章于 2026-06-14 11:36:32 发布

原创最新推荐文章于 2026-06-14 11:36:32 发布 · 2.5k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

Android

本文详细介绍了Android中TabHost及其升级版FragmentTabHost的使用方法与布局配置，对比了两者之间的区别，并深入探讨了TabWidget及Indicator的作用。

 
 TabHost是整个Tab的容器，包括两部分，TabWidget和FrameLayout。

 
 T
 abWidget就是每个tab的标签，FrameLayout则是tab内容。

 
 TabHost、
 TabWidget、
 FrameLayout的anroid:id不能随意设置，必须指定id为：

 
 android:id="@android:id/tabhost"

 
 android:id="@android:id/tabs"

 
 android:id="@android:id/tabcontent"

老版本标准的tabhost layout写法：

<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"
            android:gravity="right|center_vertical" />
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:padding="5dp" />
    </LinearLayout>
</TabHost>

FragmentTabHost标准的layout的写法：

 
  <?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <FrameLayout
        android:id="@+id/realtabcontent"
        android:layout_width="fill_parent"
        android:layout_height="0dip"
        android:layout_weight="1" />
    <android.support.v4.app.FragmentTabHost
        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" 
        android:background="@drawable/maintab_toolbar_bg">
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="0" />            
    </android.support.v4.app.FragmentTabHost>
</LinearLayout>
  
 
  对应的代码：
  
 
 
 
  
      protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.fragment_tabs);
        mTabHost = (FragmentTabHost)findViewById(android.R.id.tabhost);
        mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);

        mTabHost.addTab(mTabHost.newTabSpec("simple").setIndicator("Simple"),
                FragmentStackSupport.CountingFragment.class, null);
        mTabHost.addTab(mTabHost.newTabSpec("contacts").setIndicator("Contacts"),
                LoaderCursorSupport.CursorLoaderListFragment.class, null);
        mTabHost.addTab(mTabHost.newTabSpec("custom").setIndicator("Custom"),
                LoaderCustomSupport.AppListFragment.class, null);
        mTabHost.addTab(mTabHost.newTabSpec("throttle").setIndicator("Throttle"),
                LoaderThrottleSupport.ThrottledLoaderListFragment.class, null);
    }

  
 
  为什么FragmentTabHost的layout要这样定
 
 
 
   答：
   没有为什么，Android官方文档就是这样用的！：
  
 
   http://developer.android.com/reference/android/app/TabActivity.html
  
 
   和老版本的TabHost的有何异同？
 
  
 
   可以看出，
   FragmentTabHost中，默认不需要TabWidget，不过你硬要
   多此一举，
   添加进来也没问题，
  
 
   
 
  

    其实
   FragmentTabHost继承自TabHost
  
 
  那么试着将老版本的tab_right_gravity.xml中的TabWidget，和TabContent定义去掉呢？
 
 
 
  答：TabHost.setup()时，找不到
  android:id="@android:id/tabs"，
  直接crash。
 

 
 最后，你要理解Indicator到底是什么东东
 
 Indicator其实就是TabWidget的子view，从继承关系上可以看出，TabWidget继承自ViewGroup。

 
 也就是说TabWidget有多个子view，那么每个子view就是一个Indicator，

 
 就是我们用手指去点的那些个tab，也可以说是标签。

 
  TabSpec.setIndicator(View)，这里的view可以是你自定义的tab indicator的view，
 
  之后你可以通过
  TabHost.getTabWidget().getChildTabViewAt(i)获取到指定位置的indicator view，
 
  比如下面这句就是获取到指定位置的indicator view，为其设置背景:
 
  mTabHost.getTabWidget().getChildTabViewAt(i).setBackgroundResource(R.drawable.selector_tab_background);
 
  实际上如果你真的要设置indicator的每个子view的背景的话，这样干就把简单的事搞复杂了，
 
  为什么不在indicator view的layout里面直接指定
  background
  呢：android:background="@drawable/selector_tab_background"