使用TabHost实现顶部菜单栏

首先,分析下使用TabHost的布局。

最外层就是一个TabHost布局,上边为菜单布局,菜单下边为内容,使用线性布局实现。

菜单栏为一个TabWidget,要实现点击每个菜单,跳转不同的内容界面,所有内容布局中就需要使用

帧布局FrameLayout.


给出布局文件:

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

    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical"
        >
        <TabWidget 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@android:id/tabs"
            >
        </TabWidget>
        <FrameLayout 
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:id="@android:id/tabcontent"
            >
            <LinearLayout 
                android:id="@+id/page1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                <TextView 
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="第一页"
                    />
            </LinearLayout>
            
            <LinearLayout 
                android:id="@+id/page2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                <TextView 
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="第二页"
                    />
            </LinearLayout>
            
            <LinearLayout 
                android:id="@+id/page3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                <TextView 
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="第三页"
                    />
            </LinearLayout>
        </FrameLayout>
    </LinearLayout>

</TabHost>

Activity:

package com.example.tabhost;

import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.TabHost;
import android.widget.TabHost.TabSpec;

public class MainActivity extends ActionBarActivity {

	TabHost tabHost;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		
		tabHost = (TabHost) this.findViewById(R.id.tabhost);
		tabHost.setup();//一定要执行该方法,该方法是能够查找TabWidget和FrameLayout
		
		TabSpec tabSpec = tabHost.newTabSpec("page1");//(通过帧布局实现)
		tabSpec.setIndicator("首页", getResources().getDrawable(R.drawable.i1));//设置标签题
		tabSpec.setContent(R.id.page1);//设置内容
		
		tabHost.addTab(tabSpec);
		
		tabSpec = tabHost.newTabSpec("page2");
		tabSpec.setIndicator("第二页", getResources().getDrawable(R.drawable.i2));//设置标签题
		tabSpec.setContent(R.id.page2);//设置内容
		
		tabHost.addTab(tabSpec);
		
		tabSpec = tabHost.newTabSpec("page3");
		tabSpec.setIndicator("第三页", getResources().getDrawable(R.drawable.i5));//设置标签题
		tabSpec.setContent(R.id.page3);//设置内容
		
		tabHost.addTab(tabSpec);
		
		tabHost.setCurrentTab(0);
	}
}

代码链接: http://download.csdn.net/detail/tan313/8301961

你可能感兴趣的:(使用TabHost实现顶部菜单栏)