andorid 选项卡

来源:互联网 发布:面向对象java怎么用 编辑:程序博客网 时间:2024/06/05 15:45
选项卡主要由TabHost、TabWidget和FrameLayout3个组件组成,用于实现一个多标签页的用户界面,通过它可以将一个复杂的对话框分割成若干个标签页,实现对信息的分类显示和管理。使用该组件不仅可以使界面简洁大方,还可以有效地减少窗体的个数。

在Android中,实现选项卡的一般步骤如下:
(1)在布局文件中添加实现选项卡所需的TabHost、TabWidget和FrameLayout组件。
(2)编写各标签页中需要显示内容所对应的XML布局文件。
(3)在Activity中,获取并初始化TabHost组件。
(4)为TabHost对象添加标签页

下面通过一个实例来说明选项卡的应用

在main.xml布局文件中,首先添加一个TabHost组件,然后在该组件中添加线性布局管理器,并且在该布局中添加一个作为标签组的TabWidget和一个作为标签内容的FrameLayout组件。
res/layout/main.xml:
[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
  2.     xmlns:tools="http://schemas.android.com/tools"  
  3.     android:id="@android:id/tabhost"  
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent">  
  6.     <LinearLayout  
  7.         android:orientation="vertical"  
  8.         android:layout_width="fill_parent"  
  9.         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.         </FrameLayout>  
  19.     </LinearLayout>  
  20. </TabHost>  

编写各标签页中要显示内容对应的XML布局文件:
res/layout/tab1.xml:
[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="wrap_content"  
  4.     android:layout_height="wrap_content"  
  5.     android:id="@+id/linearLayout1"  
  6.     android:orientation="vertical" >  
  7.     <TextView  
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="wrap_content"  
  10.         android:text="界面1"/>  
  11.     <TextView  
  12.         android:layout_width="fill_parent"  
  13.         android:layout_height="wrap_content"  
  14.         android:text="欢迎来到界面1"/>  
  15. </LinearLayout>  

res/layout/tab2.xml:
[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="wrap_content"  
  4.     android:layout_height="wrap_content"  
  5.     android:id="@+id/linearLayout2"  
  6.     android:orientation="vertical" >  
  7.     <TextView  
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="wrap_content"  
  10.         android:text="界面2"/>  
  11.     <TextView  
  12.         android:layout_width="fill_parent"  
  13.         android:layout_height="wrap_content"  
  14.         android:text="欢迎来到界面2"/>  
  15. </LinearLayout>  

res/layout/tab3.xml:
[html] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="wrap_content"  
  4.     android:layout_height="wrap_content"  
  5.     android:id="@+id/linearLayout3"  
  6.     android:orientation="vertical" >  
  7.     <TextView  
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="wrap_content"  
  10.         android:text="界面3"/>  
  11.     <TextView  
  12.         android:layout_width="fill_parent"  
  13.         android:layout_height="wrap_content"  
  14.         android:text="欢迎来到界面3"/>  
  15. </LinearLayout>  

MainActivity:
[java] view plain copy
 在CODE上查看代码片派生到我的代码片
  1. package com.example.test;  
  2.   
  3. import android.app.Activity;  
  4. import android.os.Bundle;  
  5. import android.view.LayoutInflater;  
  6. import android.widget.TabHost;  
  7.   
  8.   
  9. public class MainActivity extends Activity {  
  10.     private TabHost tabHost;//声明TabHost组件的对象  
  11.     @Override  
  12.     protected void onCreate(Bundle savedInstanceState) {  
  13.         super.onCreate(savedInstanceState);  
  14.         setContentView(R.layout.main);  
  15.           
  16.         tabHost=(TabHost)findViewById(android.R.id.tabhost);//获取tabHost对象  
  17.         tabHost.setup();//初始化TabHost组件  
  18.           
  19.         LayoutInflater inflater=LayoutInflater.from(this);//声明并实例化一个LayoutInflater对象  
  20.         //关于LayoutInflater详细,请看我的另外一篇转载的总结  
  21.         inflater.inflate(R.layout.tab1, tabHost.getTabContentView());  
  22.         inflater.inflate(R.layout.tab2, tabHost.getTabContentView());  
  23.         inflater.inflate(R.layout.tab3, tabHost.getTabContentView());  
  24.         tabHost.addTab(tabHost.newTabSpec("tab01")  
  25.                 .setIndicator("标签页一")  
  26.                 .setContent(R.id.linearLayout1));//添加第一个标签页  
  27.         tabHost.addTab(tabHost.newTabSpec("tab02")  
  28.                 .setIndicator("标签页二")  
  29.                 .setContent(R.id.linearLayout2));//添加第二个标签页  
  30.         tabHost.addTab(tabHost.newTabSpec("tab03")  
  31.                 .setIndicator("标签页三")  
  32.                 .setContent(R.id.linearLayout3));//添加第三个标签页  
  33.     }  
  34. }  

效果如图:

要想把选项卡标题放在底部,实现这个很简单,只需将布局文件 中<TabWidget />
标签加个android:layout_gravity="bottom",选项卡就会显示在页面底部,
默认是 android:layout_gravity="top"。或者在LinearLayout布局下将<TabWidget />

标签将放在<FrameLayout/>标签下

转载请注明出处:http://blog.csdn.net/acmman/article/details/44904205

0 0