Android_TabHost用户界面之一_140930

最新推荐文章于 2025-09-12 19:52:27 发布

原创最新推荐文章于 2025-09-12 19:52:27 发布 · 621 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #可运行代码下载 #TabHost #TabWidgt #继承与Activity

本文记录了作者在学习TabHost与ListView在Android UI设计中的应用过程中的笔记，包括两种实现方式和相应的XML布局代码。通过实例展示了如何在Activity中设置TabHost并配置内容布局。

TabHost 和 ListView 类似，都是UI 界面设计的一种便携方式；接下来记录一些个人的学习笔记

TabHost ，查阅了一些资料发现，有两种方式

1）继承TabActivity，从TabActivity中用getTabHost()方法获取TabHost.。只要定义具体Tab内容布局就可以了（这在参考的链接中包含）

2）不用继承TabActivity，在布局文件中定义TabHost即可，但是 TabWidget的id必须是 @android:id/tabs，FrameLayout的id必须是@android:id/tabcontent。TabHost的id可以自定义.

个人比较喜欢第二种方法，因此用第二种方法。

//activity_main.xml

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

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

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <LinearLayout
                android:id="@+id/tab1"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="11111111" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab2"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="22222222" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab3"
                android:layout_width="match_parent"
                android:layout_height="match_parent" >

                <Button
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="33333333" />
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>

</TabHost>

注释：

TabWidget：未标题栏，其中定义了 @android:id/tabs数组，这些id可在MainActivity.java文件中设置显示的内容

FrameLayout: 内容栏，其中定义了 @android:id/content数组，这些 content与tabs 为一一对应的关系

//MainActivity.java文件

package com.yline.tabhost;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TabHost;

public class MainActivity extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);

		TabHost tabHost = (TabHost) findViewById(R.id.tabhost);  
		tabHost.setup();

		tabHost.addTab(tabHost.newTabSpec("界面1")  
				.setIndicator("界面1", getResources().getDrawable(R.drawable.ic_launcher))  
				.setContent(R.id.tab1));

		tabHost.addTab(tabHost.newTabSpec("界面2")  
				.setIndicator("界面2")  
				.setContent(R.id.tab2));

		tabHost.addTab(tabHost.newTabSpec("界面3")  
				.setIndicator("界面3")  
				.setContent(R.id.tab3));

	}
}

注释：

tabhost.setup : (提示内容的显示)

Call setup() before adding tabs if loading TabHost using findViewById(). However: You do not need to call setup() after getTabHost() inTabActivity.

如果你是使用findViewByid的方法得到TabHost，请调用setup()；(第二种方法，书写tabHost)

如果你是通过继承TabAvtivity方法使用getTabActivity方法，就不需要调用setup()。（第一种方法，书写tabHost）

Example:

mTabHost = (TabHost)findViewById(R.id.tabhost);
mTabHost.setup();
mTabHost.addTab(TAB_TAG_1, "Hello, world!", "Tab 1");

UI界面：

TabHost 代码链接：

http://pan.baidu.com/s/1bnlKiYF

借鉴资料链接：

http://zxl-ong.iteye.com/blog/744809