博客
关于我
强烈建议你试试无所不能的chatGPT，快点击我
Android工作学习第5天之TabHost实现菜单栏底部显示
阅读量：5080 次
发布时间：2019-06-12

本文共 13079 字，大约阅读时间需要 43 分钟。

TabHost是一个装载选项卡窗口的容器，实现分模块显示的效果。像新浪微博客户端、微信客户端都是使用tabehost组件来开发的。

TabHost的组成：

|---TabWidget：实现标签栏，可供用户选择的标签集合;

|---FrameLayout：实现显示内容的帧布局.

TabHost有两种实现方式：

一、在布局文件中定义TabHost

               1、在配置文件中使用TabHost标签定义布局;

                2、TabHost 的id 定义为：tabhost;

                3、TabWidget 的id 定义为：tabs;

                4、FrameLayout 的id 定义为：tabcontent.

        二、继承TabActivity类：

                在Activity中通过getTabHost() 方法取得TabHost.

       这两种方法实现的效果是一样的，但是后者不需要定义TabHost的布局文件，使用起来比较方便，推荐大家使用这种方式。

 

先来看看实现的效果吧：

 

 

下面给出源代码：

第一种方式(使用xml布局)：

工程目录结构

main.xml

 

[html]
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:orientation="vertical" > 
  6.  
  7.     <TabHost  
  8.         android:id="@+id/tablehost" 
  9.         android:layout_width="fill_parent" 
  10.         android:layout_height="fill_parent"> 
  11.         <LinearLayout android:orientation="vertical" 
  12.                       android:layout_width="fill_parent" 
  13.                       android:layout_height="fill_parent"> 
  14.             <TabWidget  
  15.                 android:id="@android:id/tabs" 
  16.                 android:layout_height="wrap_content" 
  17.                 android:layout_width="fill_parent"/> 
  18.                 <FrameLayout  
  19.                     android:id="@android:id/tabcontent" 
  20.                     android:layout_width="fill_parent" 
  21.                     android:layout_height="fill_parent"> 
  22.                 </FrameLayout> 
  23.              
  24.         </LinearLayout> 
  25.     </TabHost> 
  26. </LinearLayout> 
[html]
  1. <?xmlversion="1.0"encoding="utf-8"?> 
  2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:orientation="vertical"> 
  6.  
  7.     <TabHost  
  8.         android:id="@+id/tablehost" 
  9.         android:layout_width="fill_parent" 
  10.         android:layout_height="fill_parent"> 
  11.         <LinearLayoutandroid:orientation="vertical" 
  12.                       android:layout_width="fill_parent" 
  13.                       android:layout_height="fill_parent"> 
  14.             <TabWidget  
  15.                 android:id="@android:id/tabs" 
  16.                 android:layout_height="wrap_content" 
  17.                 android:layout_width="fill_parent"/> 
  18.                 <FrameLayout  
  19.                     android:id="@android:id/tabcontent" 
  20.                     android:layout_width="fill_parent" 
  21.                     android:layout_height="fill_parent"> 
  22.                 </FrameLayout> 
  23.              
  24.         </LinearLayout> 
  25.     </TabHost> 
  26. </LinearLayout> 

 

home.xml

 

[html]
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.      android:layout_width="match_parent" 
  4.      android:layout_height="fill_parent" 
  5.      android:background="#0000FF" 
  6.      android:id="@+id/home" 
  7.      android:orientation="vertical"> 
  8.      
  9.     <TextView 
  10.          android:layout_width="fill_parent" 
  11.          android:layout_height="wrap_content" 
  12.          android:text="@string/home" 
  13.     /> 
  14.      
  15. </LinearLayout> 
[html]
  1. <?xmlversion="1.0"encoding="utf-8"?> 
  2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" 
  3.      android:layout_width="match_parent" 
  4.      android:layout_height="fill_parent" 
  5.      android:background="#0000FF" 
  6.      android:id="@+id/home" 
  7.      android:orientation="vertical"> 
  8.      
  9.     <TextView 
  10.          android:layout_width="fill_parent" 
  11.          android:layout_height="wrap_content" 
  12.          android:text="@string/home" 
  13.     /> 
  14.      
  15. </LinearLayout> 

其他3个布局文件跟home.xml一样，只是TextView的内容不同，这里就不给出代码了。

 

 

TabHostActivity.java

 

[html]
  1. package cn.bdqn.tabhost; 
  2.  
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5. import android.view.LayoutInflater; 
  6. import android.widget.TabHost; 
  7. import android.widget.TabHost.TabSpec; 
  8.  
  9. public class TabHostActivity extends Activity { 
  10.     @Override 
  11.     public void onCreate(Bundle savedInstanceState) { 
  12.         super.onCreate(savedInstanceState); 
  13.         setContentView(R.layout.main); 
  14.         //取得TabHost 
  15.         TabHost tabhost = (TabHost) findViewById(R.id.tablehost); 
  16.         tabhost.setup(); 
  17.         LayoutInflater inflater = LayoutInflater.from(this); 
  18.         //把配置文件转换为显示TabHost内容的FrameLayout中的层级 
  19.         inflater.inflate(R.layout.home, tabhost.getTabContentView()); 
  20.         inflater.inflate(R.layout.comment, tabhost.getTabContentView()); 
  21.         inflater.inflate(R.layout.save, tabhost.getTabContentView()); 
  22.         inflater.inflate(R.layout.more, tabhost.getTabContentView()); 
  23.         //设置HOME标签 
  24.         TabSpec spec1 = tabhost.newTabSpec("HOME").setIndicator("HOME"); 
  25.         //设置HOME模块显示内容 
  26.         spec1.setContent(R.id.home); 
  27.         tabhost.addTab(spec1); 
  28.          
  29.         TabSpec spec2 = tabhost.newTabSpec("COMMENT").setIndicator("COMMENT"); 
  30.         spec2.setContent(R.id.comment); 
  31.         tabhost.addTab(spec2); 
  32.          
  33.         TabSpec spec3 = tabhost.newTabSpec("SAVE").setIndicator("SAVE"); 
  34.         spec3.setContent(R.id.save); 
  35.         tabhost.addTab(spec3); 
  36.          
  37.         TabSpec spec4 = tabhost.newTabSpec("MORE").setIndicator("MORE"); 
  38.         spec4.setContent(R.id.more); 
  39.         tabhost.addTab(spec4); 
  40.     } 
  41. } 
[html]
  1. package cn.bdqn.tabhost; 
  2.  
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5. import android.view.LayoutInflater; 
  6. import android.widget.TabHost; 
  7. import android.widget.TabHost.TabSpec; 
  8.  
  9. public class TabHostActivity extends Activity { 
  10.     @Override 
  11.     public void onCreate(Bundle savedInstanceState) { 
  12.         super.onCreate(savedInstanceState); 
  13.         setContentView(R.layout.main); 
  14.         //取得TabHost 
  15.         TabHost tabhost = (TabHost) findViewById(R.id.tablehost); 
  16.         tabhost.setup(); 
  17.         LayoutInflater inflater = LayoutInflater.from(this); 
  18.         //把配置文件转换为显示TabHost内容的FrameLayout中的层级 
  19.         inflater.inflate(R.layout.home, tabhost.getTabContentView()); 
  20.         inflater.inflate(R.layout.comment, tabhost.getTabContentView()); 
  21.         inflater.inflate(R.layout.save, tabhost.getTabContentView()); 
  22.         inflater.inflate(R.layout.more, tabhost.getTabContentView()); 
  23.         //设置HOME标签 
  24.         TabSpec spec1 = tabhost.newTabSpec("HOME").setIndicator("HOME"); 
  25.         //设置HOME模块显示内容 
  26.         spec1.setContent(R.id.home); 
  27.         tabhost.addTab(spec1); 
  28.          
  29.         TabSpec spec2 = tabhost.newTabSpec("COMMENT").setIndicator("COMMENT"); 
  30.         spec2.setContent(R.id.comment); 
  31.         tabhost.addTab(spec2); 
  32.          
  33.         TabSpec spec3 = tabhost.newTabSpec("SAVE").setIndicator("SAVE"); 
  34.         spec3.setContent(R.id.save); 
  35.         tabhost.addTab(spec3); 
  36.          
  37.         TabSpec spec4 = tabhost.newTabSpec("MORE").setIndicator("MORE"); 
  38.         spec4.setContent(R.id.more); 
  39.         tabhost.addTab(spec4); 
  40.     } 
  41. }  
package cn.bdqn.tabhost;import android.app.Activity;import android.os.Bundle;import android.view.LayoutInflater;import android.widget.TabHost;import android.widget.TabHost.TabSpec;public class TabHostActivity extends Activity {    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        //取得TabHost        TabHost tabhost = (TabHost) findViewById(R.id.tablehost);        tabhost.setup();        LayoutInflater inflater = LayoutInflater.from(this);        //把配置文件转换为显示TabHost内容的FrameLayout中的层级        inflater.inflate(R.layout.home, tabhost.getTabContentView());        inflater.inflate(R.layout.comment, tabhost.getTabContentView());        inflater.inflate(R.layout.save, tabhost.getTabContentView());        inflater.inflate(R.layout.more, tabhost.getTabContentView());        //设置HOME标签        TabSpec spec1 = tabhost.newTabSpec("HOME").setIndicator("HOME");        //设置HOME模块显示内容        spec1.setContent(R.id.home);        tabhost.addTab(spec1);                TabSpec spec2 = tabhost.newTabSpec("COMMENT").setIndicator("COMMENT");        spec2.setContent(R.id.comment);        tabhost.addTab(spec2);                TabSpec spec3 = tabhost.newTabSpec("SAVE").setIndicator("SAVE");        spec3.setContent(R.id.save);        tabhost.addTab(spec3);                TabSpec spec4 = tabhost.newTabSpec("MORE").setIndicator("MORE");        spec4.setContent(R.id.more);        tabhost.addTab(spec4);    }}

 

第二种方式(继承TabActivity)：

工程目录结构

home.xml

 

[html]
  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:orientation="vertical" 
  6.     android:background="@drawable/a"> 
  7.  
  8.     <TextView 
  9.         android:layout_width="fill_parent" 
  10.         android:layout_height="wrap_content" 
  11.         android:text="Hello world! HomeActivty" /> 
  12.  
  13. </LinearLayout> 
[html]
  1. <?xmlversion="1.0"encoding="utf-8"?> 
  2. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android" 
  3.     android:layout_width="fill_parent" 
  4.     android:layout_height="fill_parent" 
  5.     android:orientation="vertical" 
  6.     android:background="@drawable/a"> 
  7.  
  8.     <TextView 
  9.         android:layout_width="fill_parent" 
  10.         android:layout_height="wrap_content" 
  11.         android:text="Hello world! HomeActivty"/> 
  12.  
  13. </LinearLayout> 

其他3个布局文件跟这个一样。

 

 

MainActivity.java

 

[html]
  1. package com.tablehost.activity; 
  2.  
  3. import android.app.Activity; 
  4. import android.app.TabActivity; 
  5. import android.content.Intent; 
  6. import android.os.Bundle; 
  7. import android.speech.SpeechRecognizer; 
  8. import android.widget.TabHost; 
  9. import android.widget.TabHost.TabSpec; 
  10.  
  11. public class MainActivity extends TabActivity { 
  12.     @Override 
  13.     public void onCreate(Bundle savedInstanceState) { 
  14.         super.onCreate(savedInstanceState); 
  15.         //获取TabHost组件 
  16.         TabHost tabHost = getTabHost(); 
  17.         //新建一个标签页 
  18.         TabSpec tabSpec1 = (TabSpec)tabHost.newTabSpec("HOME").setIndicator("HOME"); 
  19.         //给标签页设置内容 
  20.         tabSpec1.setContent(new Intent(MainActivity.this,HomeActivity.class)); 
  21.         //把标签页添加到TabHost当中去 
  22.         tabHost.addTab(tabSpec1); 
  23.          
  24.         TabSpec tabSpec2 = (TabSpec)tabHost.newTabSpec("COMMENT").setIndicator("COMMENT"); 
  25.         tabSpec2.setContent(new Intent(MainActivity.this,CommentActivity.class)); 
  26.         tabHost.addTab(tabSpec2); 
  27.          
  28.         TabSpec tabSpec3 = (TabSpec)tabHost.newTabSpec("SAVE").setIndicator("SAVE"); 
  29.         tabSpec3.setContent(new Intent(MainActivity.this,SaveActivity.class)); 
  30.         tabHost.addTab(tabSpec3); 
  31.          
  32.         TabSpec tabSpec4 = (TabSpec)tabHost.newTabSpec("MORE").setIndicator("MORE"); 
  33.         tabSpec4.setContent(new Intent(MainActivity.this,MoreActivity.class)); 
  34.         tabHost.addTab(tabSpec4); 
  35.     } 
  36. } 
[html]
  1. package com.tablehost.activity; 
  2.  
  3. import android.app.Activity; 
  4. import android.app.TabActivity; 
  5. import android.content.Intent; 
  6. import android.os.Bundle; 
  7. import android.speech.SpeechRecognizer; 
  8. import android.widget.TabHost; 
  9. import android.widget.TabHost.TabSpec; 
  10.  
  11. public class MainActivity extends TabActivity { 
  12.     @Override 
  13.     public void onCreate(Bundle savedInstanceState) { 
  14.         super.onCreate(savedInstanceState); 
  15.         //获取TabHost组件 
  16.         TabHost tabHost = getTabHost(); 
  17.         //新建一个标签页 
  18.         TabSpec tabSpec1 = (TabSpec)tabHost.newTabSpec("HOME").setIndicator("HOME"); 
  19.         //给标签页设置内容 
  20.         tabSpec1.setContent(new Intent(MainActivity.this,HomeActivity.class)); 
  21.         //把标签页添加到TabHost当中去 
  22.         tabHost.addTab(tabSpec1); 
  23.          
  24.         TabSpec tabSpec2 = (TabSpec)tabHost.newTabSpec("COMMENT").setIndicator("COMMENT"); 
  25.         tabSpec2.setContent(new Intent(MainActivity.this,CommentActivity.class)); 
  26.         tabHost.addTab(tabSpec2); 
  27.          
  28.         TabSpec tabSpec3 = (TabSpec)tabHost.newTabSpec("SAVE").setIndicator("SAVE"); 
  29.         tabSpec3.setContent(new Intent(MainActivity.this,SaveActivity.class)); 
  30.         tabHost.addTab(tabSpec3); 
  31.          
  32.         TabSpec tabSpec4 = (TabSpec)tabHost.newTabSpec("MORE").setIndicator("MORE"); 
  33.         tabSpec4.setContent(new Intent(MainActivity.this,MoreActivity.class)); 
  34.         tabHost.addTab(tabSpec4); 
  35.     } 
  36. }  
package com.tablehost.activity;import android.app.Activity;import android.app.TabActivity;import android.content.Intent;import android.os.Bundle;import android.speech.SpeechRecognizer;import android.widget.TabHost;import android.widget.TabHost.TabSpec;public class MainActivity extends TabActivity {    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        //获取TabHost组件        TabHost tabHost = getTabHost();        //新建一个标签页        TabSpec tabSpec1 = (TabSpec)tabHost.newTabSpec("HOME").setIndicator("HOME");        //给标签页设置内容        tabSpec1.setContent(new Intent(MainActivity.this,HomeActivity.class));        //把标签页添加到TabHost当中去        tabHost.addTab(tabSpec1);                TabSpec tabSpec2 = (TabSpec)tabHost.newTabSpec("COMMENT").setIndicator("COMMENT");        tabSpec2.setContent(new Intent(MainActivity.this,CommentActivity.class));        tabHost.addTab(tabSpec2);                TabSpec tabSpec3 = (TabSpec)tabHost.newTabSpec("SAVE").setIndicator("SAVE");        tabSpec3.setContent(new Intent(MainActivity.this,SaveActivity.class));        tabHost.addTab(tabSpec3);                TabSpec tabSpec4 = (TabSpec)tabHost.newTabSpec("MORE").setIndicator("MORE");        tabSpec4.setContent(new Intent(MainActivity.this,MoreActivity.class));        tabHost.addTab(tabSpec4);    }}

HomeActivity.java

 

 

[html]
  1. package com.tablehost.activity; 
  2.  
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5.  
  6. public class HomeActivity extends Activity{ 
  7.  
  8.     @Override 
  9.     protected void onCreate(Bundle savedInstanceState) { 
  10.         super.onCreate(savedInstanceState); 
  11.         setContentView(R.layout.home); 
  12.     } 
  13.      
  14. } 
[html]
  1. package com.tablehost.activity; 
  2.  
  3. import android.app.Activity; 
  4. import android.os.Bundle; 
  5.  
  6. public class HomeActivity extends Activity{ 
  7.  
  8.     @Override 
  9.     protected void onCreate(Bundle savedInstanceState) { 
  10.         super.onCreate(savedInstanceState); 
  11.         setContentView(R.layout.home); 
  12.     } 
  13.      
  14. }  
package com.tablehost.activity;import android.app.Activity;import android.os.Bundle;public class HomeActivity extends Activity{	@Override	protected void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.home);	}	}

其他三个CommentActivity.java ，SaveActivity.java，MoreActivity.java 跟 HomeActivity.java 差不多，这里不给出代码了。

 

最后在AndroidManifest.xml对Activity进行声明：

 

[html]
  1. <activity android:name=".HomeActivity" /> 
  2.         <activity android:name=".CommentActivity" /> 
  3.         <activity android:name=".SaveActivity" /> 
  4.         <activity android:name=".MoreActivity" />

注意它的添加：

<intent-filter>                

　　　　<action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />  

</intent-filter>

转载于:https://www.cnblogs.com/xiaofeiying/p/3713167.html

你可能感兴趣的文章
二维数组中某列的求和
查看>>
BOM问题
查看>>
[poj1066]Treasure Hunt
查看>>
SQL2000数据库定期自动备份与修改
查看>>
js类型判断及鸭式辨型
查看>>
[NOIP]模拟17 题解
查看>>
图解数据结构树之AVL树
查看>>
数据库存储中文乱码问题
查看>>
【未完】Java--线程之间的通信
查看>>
【编程之美学习笔记】2.1求二进制数中1的个数
查看>>
简单的monkey使用
查看>>
爱情九十二课，说出你的弱
查看>>
UIImageView 的contentMode属性应用
查看>>
Items 控件 - 菜单
查看>>
jQuery入门学习
查看>>
Scrum 常见错误实践 之 过长的站会
查看>>
mac os命令参考
查看>>
maven打包上传到本地中央库
查看>>
教育类APP开发现新增长，多款APP该如何突围？
查看>>
打开3389
查看>>
喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！-- 愿君每日到此一游！
当前时间: 2024-11-16 06:27:06   当前IP: 18.116.62.177   联系邮箱:javaeecc@qq.com     Copyright © 2020 - 2022 baihongyu.com 京ICP备2021015314号-2
强烈建议你试试无所不能的CHAT-GPT，快点击我
强烈建议你试试无所不能的CHAT-GPT，快点击我