android控件09---TabHost

标签页，能够用最小的空间显示更多的数据。是很多软件都需要用到的。

在Android里面常用的方法有两种：

1.继承TabActivity

2.自定义TabHost

下面，我们先来讲讲第一种：

Activity里面的代码如下：

public class MainActivity extends TabActivity { 
	private TabHost tabhost; 
	protected void onCreate(Bundle savedInstanceState) { 
		super.onCreate(savedInstanceState); 
		//setContentView(R.layout.main); //这里无需加载主页面 
		//获取TabHost对象 
		tabhost = getTabHost(); 
		//加载页面 
		LayoutInflater.from(this).inflate(R.layout.activity_main,tabhost.getTabContentView(), true);
   		//添加标签页
		//tabout.addTab(tabhost.newTabSpec("page1").setIndicator("第一页"),getResource().getDrawable(R.drawable.a1).setContent(R.id.layout));
   		//详细讲解可以看下一种方法Activity的注释
        	tabhost.addTab(tabhost.newTabSpec("page1").setIndicator("第一页").setContent(R.id.layout1));
        	tabhost.addTab(tabhost.newTabSpec("page2").setIndicator("第二页").setContent(R.id.layout2));
        	tabhost.addTab(tabhost.newTabSpec("page3").setIndicator("第三页").setContent(R.id.layout3));
    }
}

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">
    <LinearLayout
        android:id="@+id/layout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="这是第一个标签页"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/layout2"
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="这是第二个标签页"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/layout3"
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="这是第三个标签页"/>
    </LinearLayout>
</LinearLayout>

运行效果图如下：

运行的时候没有出现标题栏

接下来就是不继承TabActivity，而是自定义TabHost。

这里先看XML里的代码：

<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/tabhost"
    >
    <!-- tabhost用来存放标签对象
    在标签页中,每一页和这一页的内容,是垂直摆放的所以这里用到了线性布局
    -->
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        >
        <!-- 这里开始存放每个标签TabWidget ,这个标签可以存放所有的标签TabWidget
        android:id="@android:id/tabs"这个是在系统文件中定义的,是写死的-->
        <TabWidget
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@android:id/tabs"
            />
        <!--android:id="@android:id/tabcontent"这个是在系统文件中定义的也,是写死的-->
        <FrameLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:id="@android:id/tabcontent"
            >
            <!-- 这里放的是第一个标签的内容 -->
            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:id="@+id/page1"
                >
                <!-- 第一个的标签页显示的内容 -->
                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="这是第一个标签页"
                    />
            </LinearLayout>
            <!-- 第二个的标签页显示的内容 -->
            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:id="@+id/page2"
                >
                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="这是第二个标签页"
                    />
            </LinearLayout>
            <!-- 第三个的标签页显示的内容 -->
            <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:id="@+id/page3"
                >
                <TextView
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="这是第三个标签页"
                    />
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>
</TabHost>

然后是Activity里的内容：

public class MainActivity extends AppCompatActivity {
    TabHost tabHost;
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //找到TabHost的标签集合
        tabHost = (TabHost) this.findViewById(R.id.tabhost);
        /*如果没有继承TabActivity时，通过下面这种方法加载启动tabHost.这一句在源代码中,
        会根据findviewbyId()找到对应的TabWidget,还需要根据findViewById()找到
        这个TabWidget下面对应的标签页的内容.也就是FrameLayout这个显示控件.*/
        tabHost.setup();

        //TabSpec这个是标签页对象.
        TabHost.TabSpec tabSpec = tabHost.newTabSpec("page1");//新建一个标签页对象.
        tabSpec.setIndicator(("首页"),getResources().getDrawable(R.drawable.a1));//设置这个标签页的标题和图片
        tabSpec.setContent(R.id.page1);//指定标签页的内容页.
        tabHost.addTab(tabSpec);//把这个标签页,添加到标签对象tabHost中.

        tabSpec = tabHost.newTabSpec("page2");
        tabSpec.setIndicator("第二页");
        tabSpec.setContent(R.id.page2);
        tabHost.addTab(tabSpec);

        tabSpec = tabHost.newTabSpec("page3");
        tabSpec.setIndicator("第三页");
        tabSpec.setContent(R.id.page3);
        tabHost.addTab(tabSpec);

        // 设置标签页为默认的第一个页面.
        tabHost.setCurrentTab(0);
    }
}

上面的2种添加方式均可，看个人喜好。

下面就是运行效果图：

这里却出现了标题栏