您的位置:首页 > 移动开发 > Android开发

Android界面开发之切换卡TabWidget用法

2014-03-08 15:05 211 查看
TabWidget类似Android中查看电话簿的界面,通过多个标签切换显示不同的内容。要实现这一效果,首先要了解TabHost,它是一个用来存放多个Tab标签的容器。每一个Tab都可以对应自己的布局,比如,电话簿中的Tab布局就是一个List的线性布局了。

要使用TabHost,首先需要通过getTabHost方法来获取TabHost的对象,然后通过addTab方法来向TabHost中添加Tab。当然每个Tab在切换时都会产生一个事件,要捕捉这个事件需要设置TabActivity的事件监听沁tsetOnTabChangedListener。下面我们来看一个具体示例,运行效果如图4-65所示。当我们点击个Tab切换时,捕捉事件如图4-66所示。









首先我们来看布局中如何实现,如下代码所示。其中Tab对应的布局通过FrameLayout作为根布局,然后分别放置了3个TextView控件来显示每个Tab标签的内容。

01
<?
xml
version
=
"1.0"
encoding
=
"utf-8"
?>
02
<
TabHost
xmlns:android
=
"http://schemas.android.com/apk/res/android"
03
android:id
=
"@android:id/tabhost"
04
android:layout_width
=
"fill_parent"
05
android:layout_height
=
"fill_parent"
>
06
<
LinearLayout
07
android:orientation
=
"vertical"
08
android:layout_width
=
"fill_parent"
09
android:layout_height
=
"fill_parent"
>
10
<
TabWidget
11
android:id
=
"@android:id/tabs"
12
android:layout_width
=
"fill_parent"
13
android:layout_height
=
"wrap_content"
/>
14
<
FrameLayout
15
android:id
=
"@android:id/tabcontent"
16
android:layout_width
=
"fill_parent"
17
android:layout_height
=
"fill_parent"
>
18
<
TextView
19
android:id
=
"@+id/textview1"
20
android:layout_width
=
"fill_parent"
21
android:layout_height
=
"fill_parent"
22
android:text
=
"this
isatab"
/>
23
<
TextView
24
android:id
=
"@+id/textview2"
25
android:layout_width
=
"fill_parent"
26
android:layout_height
=
"fill_parent"
27
android:text
=
"this
isanothertab"
/>
28
<
TextView
29
android:id
=
"@+id/textview3"
30
android:layout_width
=
"fill_parent"
31
android:layout_height
=
"fill_parent"
32
android:text
=
"this
isathirdtab"
/>
33
</
FrameLayout
>
34
</
LinearLayout
>
35
</
TabHost
>
TabWidget的使用需要继承自TabActivity类,并实现tsetOnTabChangedListener的onTabChanged方法来监听Tab的改变,如下代码所示:

01
package
com.yarin.android.Examples_04_29;
02
03
import
android.app.AlertDialog;
04
import
android.app.Dialog;
05
import
android.app.TabActivity;
06
import
android.content.DialogInterface;
07
import
android.graphics.Color;
08
import
android.os.Bundle;
09
import
android.widget.TabHost;
10
import
android.widget.TabHost.OnTabChangeListener;
11
12
public
class
Activity01
extends
TabActivity
13
{
14
//声明TabHost对象
15
TabHost
mTabHost;
16
/**
Calledwhentheactivityisfirstcreated.*/
17
@Override
18
public
void
onCreate(Bundle
savedInstanceState)
19
{
20
super
.onCreate(savedInstanceState);
21
setContentView(R.layout.main);
22
23
//取得TabHost对象
24
mTabHost
=getTabHost();
25
26
/*
为TabHost添加标签*/
27
//新建一个newTabSpec(newTabSpec)
28
//设置其标签和图标(setIndicator)
29
//设置内容(setContent)
30
mTabHost.addTab(mTabHost.newTabSpec(
"tab_test1"
)
31
.setIndicator(
"TAB
1"
,getResources().getDrawable(R.drawable.img1))
32
.setContent(R.id.textview1));
33
mTabHost.addTab(mTabHost.newTabSpec(
"tab_test2"
)
34
.setIndicator(
"TAB
2"
,getResources().getDrawable(R.drawable.img2))
35
.setContent(R.id.textview2));
36
mTabHost.addTab(mTabHost.newTabSpec(
"tab_test3"
)
37
.setIndicator(
"TAB
3"
,getResources().getDrawable(R.drawable.img3))
38
.setContent(R.id.textview3));
39
40
//设置TabHost的背景颜色
41
mTabHost.setBackgroundColor(Color.argb(
150
,
22
,
70
,
150
));
42
//设置TabHost的背景图片资源
43
//mTabHost.setBackgroundResource(R.drawable.bg0);
44
45
//设置当前显示哪一个标签
46
mTabHost.setCurrentTab(
0
);
47
48
//标签切换事件处理,setOnTabChangedListener
49
mTabHost.setOnTabChangedListener(
new
OnTabChangeListener()
50
{
51
//
TODOAuto-generatedmethodstub
52
@Override
53
public
void
onTabChanged(String
tabId)
54
{
55
Dialog
dialog=
new
AlertDialog.Builder(Activity01.
this
)
56
.setTitle(
"提示"
)
57
.setMessage(
"当前选中:"
+tabId+
"标签"
)
58
.setPositiveButton(
"确定"
,
59
new
DialogInterface.OnClickListener()
60
{
61
public
void
onClick(DialogInterface
dialog,
int
whichButton)
62
{
63
dialog.cancel();
64
}
65
}).create();
//创建按钮
66
67
dialog.show();
68
}
69
});
70
}
71
}
至此,AndroidTabWidget的用法就介绍完了,同时,也结束了这次的Android界面开发专题,谢谢阅读!

文章转载:http://www.itivy.com/android/archive/2011/11/16/android-tabwidget-usage.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐