安卓开发复习笔记——TabHost组件(实现底部菜单导航)

安卓开发复习笔记——TabHost组件(实现底部菜单导航)

4

来源:cnblog    阅读:1048   时间:2014-09-16

什么是TabHost?

TabHost组件的主要功能是可以进行应用程序分类管理,例如:在用户使用windows操作系统的时候,经常见到如图所示的图形界面。

TabHost选项卡,说到这个组件,不得不先说一件事情,翻翻谷歌提供给我们的API,我们可以发现这样的一段话:

它告诉我们,这个组件在安卓4.0之后已经被废弃了,建议我们新的程序应该使用Fragment组件来代替它。

其实并不出乎意料,使用过TabHost的朋友应该都知道:

1、它的设计违反了Activity单一窗口原则,它可以同时加载多个Activity,然后再它们之间进行来回切换。

2、有个很致命的问题就是当我们点击别的选项时,按下Back后退键,它会使整个应用程序都退出,而不是切换到前一个选项卡,虽然我们可以在主程序里覆写OnKeyDown这个方法,但这样就会导致每一次按下Back后退键都只能回到第一个选项菜单。

但作为开发者,这个具有历史里程碑的组件,我们还是需要去掌握下,下面给几张图来看下今天要实现的效果:

  

下面附上代码(注释很详细)

实现TabHost有两种方式:

方式一:直接让一个Activity程序继承TabActivity类(通过getTabHost取得实例);

方式二:定义XML布局文件利用findViewById()方法取得TagHost组件,通过setup()方法实例化并进行若干配置;

下面讲解以第二种方式为例,先看下项目结构:

1、TabHost主布局文件

activity_main.xml(为了使选项卡显示在屏幕下方,这里采用了相对布局)

 1 <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
 2     android:id="@+id/mytabhost"
 3     android:layout_width="fill_parent"
 4     android:layout_height="fill_parent">
 5
 6     <!-- 需要一个布局管理器 -->
 7
 8     <RelativeLayout
 9         android:layout_width="fill_parent"
10         android:layout_height="fill_parent"
11         >
12
13                 <!--
14        由于TabHost是继承于FrameLayout,所以需要一个FrameLaytout布局(内容页) ,id
15        必须为tabcontent
16         -->
17
18         <FrameLayout
19             android:id="@android:id/tabcontent"
20             android:layout_width="fill_parent"
21             android:layout_height="fill_parent"
22             >
23         </FrameLayout>
24
25         <!-- TabWidget必须标签,用来存放tab标签,且id必须为tabs -->
26
27         <TabWidget
28             android:id="@android:id/tabs"
29             android:layout_width="fill_parent"
30             android:layout_height="wrap_content"
31             android:background="@drawable/tab_widget_background"
32             android:layout_alignParentBottom="true"
33             >
34         </TabWidget>
35
36     </RelativeLayout>
37
38 </TabHost>

TabHost的布局的文件必须遵循下面几点:

1、所有的用于标签配置的文件,必须以“<TabHost>”为根节点;

2、为了保证标签页和标签内容显示正常(例如:标签提示要放在标签显示内容之上)则可以采用一个布局管理器进行布局(例如:LinearLayout,RelativeLayout..)

3、定义一个“<TagWidget>”的标签,用于表示整个标签容器,另外在定义此组件ID为“tabs”,表示允许加入多个标签

4、由于TabHost是FrameLayout的子类,所以要想定义标签页内容必须使用FrameLayout布局,并且标签ID为“tabcontent”

至于为什么要遵循这些条件,我们打看下TabHost的源码就可以发现:

2、每个标签的布局文件

tab_layout.xml

 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:gravity="center_horizontal"
 6      android:background="@drawable/tab_selector"
 7     android:orientation="vertical" >
 8
 9     <ImageView
10         android:id="@+id/image"
11         android:layout_width="wrap_content"
12         android:layout_height="wrap_content"
13         android:padding="3dp" />
14
15     <TextView
16         android:id="@+id/title"
17         android:layout_width="wrap_content"
18         android:layout_height="wrap_content"
19         android:textColor="@android:color/white"/>
20
21 </LinearLayout>

3、一个选择器,用于美观效果

tab_selector.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <selector xmlns:android="http://schemas.android.com/apk/res/android" >
 3     <item
 4         android:state_pressed="true" android:drawable="@drawable/tab_item_p"
 5         ></item>
 6     <item
 7         android:state_selected="true" android:drawable="@drawable/tab_item_d"
 8         ></item>
 9
10 </selector>

4、跳转Activity的布局文件(由于基本一致,这里只给出其中一个)

tabactivity.xml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent" >
 5
 6     <LinearLayout
 7         android:layout_width="match_parent"
 8         android:layout_height="match_parent"
 9         android:orientation="vertical" >
10
11
12         <TextView
13             android:id="@+id/title"
14             android:layout_width="wrap_content"
15             android:layout_height="wrap_content"
16             android:text="我是界面1"/>
17     </LinearLayout>
18
19 </RelativeLayout>

5、JAVA主代码

 1 package com.example.tabhosttest;
 2
 3 import android.app.ActivityGroup;
 4 import android.content.Intent;
 5 import android.os.Bundle;
 6 import android.view.View;
 7 import android.widget.ImageView;
 8 import android.widget.TabHost;
 9 import android.widget.TabHost.TabSpec;
10 import android.widget.TextView;
11
12 public class MainActivity extends ActivityGroup{
13
14     private TabHost tabHost;//声明一个TabHost对象
15
16     //资源文件
17     private Class activitys[]={TabActivity1.class,TabActivity2.class,TabActivity3.class,TabActivity4.class,TabActivity5.class};//跳转的Activity
18     private String title[]={"首页","搜索","设置","主题","更多"};//设置菜单的标题
19     private int image[]={R.drawable.tab_icon1,R.drawable.tab_icon2,R.drawable.tab_icon3,R.drawable.tab_icon4,R.drawable.tab_icon5,};//设置菜单
20
21     @Override
22     protected void onCreate(Bundle savedInstanceState) {
23         super.onCreate(savedInstanceState);
24         setContentView(R.layout.activity_main);
25         initTabView();//初始化tab标签
26
27     }
28
29     private void initTabView() {
30         //实例化tabhost
31         this.tabHost=(TabHost) findViewById(R.id.mytabhost);
32         //由于继承了ActivityGroup,所以需要在setup方法里加入此参数,若继承TabActivity则可省略
33         tabHost.setup(this.getLocalActivityManager());
34
35         //创建标签
36         for(int i=0;i<activitys.length;i++){
37             //实例化一个view作为tab标签的布局
38             View view=View.inflate(this, R.layout.tab_layout, null);
39
40             //设置imageview
41             ImageView imageView=(ImageView) view.findViewById(R.id.image);
42             imageView.setImageDrawable(getResources().getDrawable(image[i]));
43             //设置textview
44             TextView textView=(TextView) view.findViewById(R.id.title);
45             textView.setText(title[i]);
46             //设置跳转activity
47             Intent intent=new Intent(this, activitys[i]);
48
49             //载入view对象并设置跳转的activity
50             TabSpec spec=tabHost.newTabSpec(title[i]).setIndicator(view).setContent(intent);
51
52             //添加到选项卡
53             tabHost.addTab(spec);
54         }
55
56     }
57
58
59 }

这里有个重载方法setIndicator(),这里是用来设置标签页:

1、public TabHost.TabSpec setIndicator(CharSequence label)

设置标题,此时无图标

2、public TabHost.TabSpec setIndicator(CharSequence label, Drawable icon)

设置标题、图标(这里的图标可以用getResources().getDrawable(int id))来设置

3、public TabHost.TabSpec setIndicator(View view)

设置自定义view

还有个setContent(Intent intent),这里是用来设置标签内容的,也就是我们要跳转的Activity

由于这里有5个选项卡,因此就有5个Activity,具体内容就看自己需求了,这里就不再给出

记得写完Activity要在AndroidManifest.xml配置文件中声明

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
 3     package="com.example.tabhosttest"
 4     android:versionCode="1"
 5     android:versionName="1.0" >
 6
 7     <uses-sdk
 8         android:minSdkVersion="8"
 9         android:targetSdkVersion="21" />
10
11     <application
12         android:allowBackup="true"
13         android:icon="@drawable/ic_launcher"
14         android:label="@string/app_name"
15         android:theme="@style/AppTheme" >
16         <activity
17             android:name=".MainActivity"
18             android:label="@string/app_name" >
19             <intent-filter>
20                 <action android:name="android.intent.action.MAIN" />
21
22                 <category android:name="android.intent.category.LAUNCHER" />
23             </intent-filter>
24         </activity>
25         <activity
26             android:name="com.example.tabhosttest.TabActivity1"
27             android:label="@string/app_name" >
28         </activity>
29         <activity
30             android:name="com.example.tabhosttest.TabActivity2"
31             android:label="@string/app_name" >
32         </activity>
33         <activity
34             android:name="com.example.tabhosttest.TabActivity3"
35             android:label="@string/app_name" >
36         </activity>
37         <activity
38             android:name="com.example.tabhosttest.TabActivity4"
39             android:label="@string/app_name" >
40         </activity>
41         <activity
42             android:name="com.example.tabhosttest.TabActivity5"
43             android:label="@string/app_name" >
44         </activity>
45     </application>
46
47 </manifest>

好了,到这里底部导航菜单就实现了,试试吧~

时间: 03-18

安卓开发复习笔记——TabHost组件(实现底部菜单导航)的相关文章

安卓开发复习笔记——WebView组件

我们专业方向本是JAVA Web,这学期突然来了个手机App开发的课设,对于安卓这块,之前自学过一段时间,有些东西太久没用已经淡忘了 准备随笔记录些复习笔记,也当做温故知新吧~ 1.什么是WebView? WebView(网络视图)能加载显示网页,可以将其视为一个浏览器,它使用了WebKit渲染引擎加载显示网页. 废话不多说,直接上代码 1.需要在xml布局文件中声明WebView组件 1 <WebView 2 android:id="@+id/webview" 3 androi

安卓开发复习笔记——ViewPager组件(仿微信引导界面&gt;)

这2天事情比较多,都没时间更新博客,趁周末,继续继续~ 今天来讲个比较新潮的组件——ViewPager 什么是ViewPager? ViewPager是安卓3.0之后提供的新特性,继承自ViewGroup,专门用以实现左右滑动切换View的效果. 如果想向下兼容就必须要android-support-v4.jar这个包的支持,这是一个来自google提供的一个附加包. 通俗点来讲,就是现在市面上大多数app,安装完第一次打开软件会出现的一个左右滑动的引导界面. 先来看下效果图:     这是一个

安卓开发复习笔记——GridView组件

1.什么是GridView? GridView(网格视图)是按照行列的方式来显示内容的,一般用于显示图片,图片等内容,比如实现九宫格图,用GridView是首选,也是最简单的. 2.正文 GridView的用法很多,网上介绍最多的方法就是自己实现一个ImageAdapter继承BaseAdapter,再供GridView使用,太多的东西我就不再重复去写,这次记录点不一样的用法. 先看下效果图:(点击应用图标以Toast的方式显示信息) 首先先说下GridView常用的XML属性: 属性名称 描述

安卓开发复习笔记——Gallery组件+ImageSwitcher组件

什么是Gallery? Gallery是一个水平的列表选择框,它允许用户通过拖动来查看上一个.下一个列表选项. 下图是今天要实现的最终效果: 利用Gallery组件实现的一个横向显示图像列表,可以通过左.右滑动屏幕来切换图像,并加上ImageSwitcher实现一个大图片预览功能. 1.一步一步来吧,首先先解决下上半部分(图像导航) 先来看下效果图,下图是利用Gallery组件实现的一个横向显示图像列表,可以通过左.右滑动屏幕来切换图像.   直接上代码,注释很全. MainActivity.j

安卓开发复习笔记——Fragment+FragmentTabHost组件(实现新浪微博底部菜单)

记得之前写过2篇关于底部菜单的实现,由于使用的是过时的TabHost类,虽然一样可以实现我们想要的效果,但作为学习,还是需要来了解下这个新引入类FragmentTabHost 之前2篇文章的链接: 安卓开发复习笔记——TabHost组件(一)(实现底部菜单导航) 安卓开发复习笔记——TabHost组件(二)(实现底部菜单导航) 关于Fragment类在之前的安卓开发复习笔记——Fragment+ViewPager组件(高仿微信界面)也介绍过,这里就不再重复阐述了. 国际惯例,先来张效果图: 下面

安卓开发复习笔记——Fragment+ViewPager组件(高仿微信界面)

什么是ViewPager? 关于ViewPager的介绍和使用,在之前我写过一篇相关的文章<安卓开发复习笔记——ViewPager组件(仿微信引导界面)>,不清楚的朋友可以看看,这里就不再重复. 什么是Fragment? Fragment是Android3.0后新增的概念,Fragment名为碎片,不过却和Activity十分相似,具有自己的生命周期,它是用来描述一些行为或一部分用户界面在一个Activity中,我们可以合并多个Fragment在一个单独的activity中建立多个UI面板,或

安卓开发复习笔记——Menu菜单组件(选项菜单,上下文菜单,子菜单)

菜单是用户界面中最常见的元素之一,使用非常频繁,在Android中,菜单被分为如下三种,选项菜单(OptionsMenu).上下文菜单(ContextMenu)和子菜单(SubMenu). 菜单的实现方式有2种:一种是通过布局文件xml生成菜单,另一种是通过代码生成. 三种菜单内容有点多,不过大体相似,一次性讲完吧,本人偏好代码动态生成,下面就以代码为例. 1.选项菜单(OptionsMenu) 先来看下选项菜单的效果图:   在一个Activity界面中点击手机Menu键,在屏幕下方弹出的菜单

转-TabHost组件(二)(实现底部菜单导航)

http://www.cnblogs.com/lichenwei/p/3975095.html 上面文章<安卓开发复习笔记——TabHost组件(一)(实现底部菜单导航)>中提到了利用自定义View(ImageView+TextView)来设置一个底部菜单的样式 这边再补充一种更为灵活的方法,可以把TabWidget隐藏,用(RadioGroup+RadioButton)来代替,并利用监听器的方式来实现监听点击点击跳转Activity. 在讲解之前,先补充几点: 1.当我们取得TabHost的

转-TabHost组件(一)(实现底部菜单导航)

http://www.cnblogs.com/lichenwei/p/3974009.html 什么是TabHost? TabHost组件的主要功能是可以进行应用程序分类管理,例如:在用户使用windows操作系统的时候,经常见到如图所示的图形界面. TabHost选项卡,说到这个组件,不得不先说一件事情,翻翻谷歌提供给我们的API,我们可以发现这样的一段话: 它告诉我们,这个组件在安卓4.0之后已经被废弃了,建议我们新的程序应该使用Fragment组件来代替它. 其实并不出乎意料,使用过Tab