Android选项卡(TabWidget)应用-CFANZ编程社区

2010-10-08 15:24:3

Android选项卡(TabWidget)应用_移动开发

步骤

1.建立两个Activity，作为tab内容（我这里是OneActivity、TestActivity)

public
 class
 OneActivity extends
 Activity {

    public
 void
 onCreate(
Bundle savedInstanceState)
 {

        super
.onCreate
(
savedInstanceState)
;

 
        TextView textview =
 new
 TextView(
this
)
;

        textview.setText
(
"This is the Artists tab"
)
;

        setContentView(
textview)
;

    }

}

2.在layout文件夹中建立tab.xml用于怎样显示tab页面

注意：TabHost ，TabWidget ，FrameLayout的ID必须分别为@android:id/tabhost，@android:id/tabs，@android:id/tabcontent
另外还要注意一下android:layout_width宽度和android:layout_height高度的取值，还要LinearLayout的 android:orientation=”vertical”（LinearLayout默认是横向的）当你看到布局和我不一样时你就要考虑一下这里是不是错了。（= =！因为我错过）

<?xml
 version
="1.0"
 encoding
="utf-8"
?>


<TabHost
 android:id
="@android:id/tabhost"
 android:layout_width
="fill_parent"


 android:layout_height
="fill_parent"
 xmlns:android
="http://schemas.android.com/apk/res/android"
>


 <LinearLayout


  android:orientation
="vertical"


  android:layout_width
="fill_parent"


  android:layout_height
="fill_parent"


  >


  <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
="fill_parent"


            android:layout_height
="fill_parent"


            android:padding
="5dp"
 />


 </LinearLayout>



</TabHost>

3.新建一个类TabWidget.java，继承TabActivity类

package
 com.fatkun
;

 
import
 android.app.TabActivity
;

import
 android.content.Intent
;

import
 android.content.res.Resources
;

import
 android.os.Bundle
;

import
 android.widget.TabHost
;

import
 android.widget.TabHost.TabSpec
;

 
public
 class
 TabWidget extends
 TabActivity {

 
 /** Called when the activity is first created. */

 @Override
 public
 void
 onCreate(
Bundle savedInstanceState)
 {

     super
.onCreate
(
savedInstanceState)
;

     setContentView(
R.layout
.tab
)
;
//这里使用了上面创建的xml文件（Tab页面的布局）

     Resources res =
 getResources(
)
;
 // Resource object to get Drawables

     TabHost tabHost =
 getTabHost(
)
;
  // The activity TabHost

     TabSpec spec;

     Intent intent;
  // Reusable Intent for each tab

 
   //第一个TAB

     intent =
 new
 Intent(
this
,OneActivity.class
)
;
//新建一个Intent用作Tab1显示的内容

     spec =
 tabHost.newTabSpec
(
"tab1"
)
//新建一个 Tab

     .setIndicator
(
"Tab1"
, res.getDrawable
(
android.R
.drawable
.ic_media_play
)
)
//设置名称以及图标

     .setContent
(
intent)
;
//设置显示的intent，这里的参数也可以是R.id.xxx

     tabHost.addTab
(
spec)
;
//添加进tabHost

 
     //第二个TAB

     intent =
 new
 Intent(
this
,TestActivity.class
)
;
//第二个Intent用作Tab1显示的内容

     spec =
 tabHost.newTabSpec
(
"tab2"
)
//新建一个 Tab

     .setIndicator
(
"Tab2"
, res.getDrawable
(
android.R
.drawable
.ic_menu_camera
)
)
//设置名称以及图标

     .setContent
(
intent)
;
//设置显示的intent，这里的参数也可以是R.id.xxx

     tabHost.addTab
(
spec)
;
//添加进tabHost

 
     tabHost.setCurrentTab
(
1
)
;

 }

 
}

4.最后一步，在AndroidManifest.xml加入你的Activity

android:theme=”@android:style/Theme.NoTitleBar”是可以使得TabWidget窗口没有标题，多点空间显示

<activity
 android:name
="TabWidget"
 android:theme
="@android:style/Theme.NoTitleBar"
>
</activity>



    <activity
 android:name
="OneActivity"
>
</activity>



    <activity
 android:name
="TestActivity"
>
</activity>

1、选项卡中的布局如果想从setContextView(R.layout.tab)指定，那么xml配置文件应该如下编写：

<?xml version="1.0" encoding="utf-8"?> 
 <TabHost xmlns:android="http://schemas.android.com/apk/res/android" 
 android:id="@android:id/tabhost" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent"> 
 <LinearLayout 
 android:orientation="vertical" 
 android:layout_width="fill_parent" 
 android:layout_height="fill_parent"> 
 <!-- 如果代码中使用setContextView()指定布局文件，必须加入该控件的声明，否则无法运行！而且TabWidget后需要使用Framelayout布局 -->
 <TabWidget 
 android:id="@android:id/tabs" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" /> 
 ..................................

这样才可以。
2、如果在代码中不采取setContextView()方式加载布局，则在程序，动态选择布局：
TabHost mTobHost=getTabHost();
LayoutInflater.from(this).inflate(R.layout.main,mTobHost.getTabContentView(),true);
mTobHost.addTab(mTobHost.newTabSpec("---tab1").setIndicator("TAB1").setContent(R.id.txtOne));
mTobHost.addTab(mTobHost.newTabSpec("---tab2").setIndicator("TAB2").setContent(R.id.txtTwo));
mTobHost.addTab(mTobHost.newTabSpec("---tab3").setIndicator("TAB3").setContent(R.id.txtThree));
mTobHost.setCurrentTab(0);
这样完成。
如果想实现采取第一种方式实现选项卡位于屏幕的下方，将布局方式为RelativeLayout,同时设置TabWidget的 android:layout_alignParentBottom="true"。