博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Android之UI学习篇九:使用TabHost实现卡片选项菜单
阅读量:5756 次
发布时间:2019-06-18

本文共 4179 字,大约阅读时间需要 13 分钟。

hot3.png

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

home.xml

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

TabHostActivity.java

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

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

MainActivity.java

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

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进行声明:

好了,这篇先暂时介绍到这里,后面我会讲一篇模拟新浪微博客户端的案例,跟大家分享一下。

转载于:https://my.oschina.net/yolinfeng/blog/378883

你可能感兴趣的文章
我的友情链接
查看>>
mysql数据类型---数值型---int
查看>>
为eclipse安装maven插件
查看>>
公司新年第一次全员大会小记
查看>>
最懒的程序员
查看>>
JAVA8 Stream 浅析
查看>>
inner join on, left join on, right join on要详细点的介绍
查看>>
SAS vs SSD对比测试MySQL tpch性能
查看>>
Spring boot 整合CXF webservice 全部被拦截的问题
查看>>
Pinpoint跨节点统计失败
查看>>
【Canal源码分析】Canal Server的启动和停止过程
查看>>
机房带宽暴涨问题分析及解决方法
查看>>
iOS 绕过相册权限漏洞
查看>>
我的友情链接
查看>>
XP 安装ORACLE
查看>>
八、 vSphere 6.7 U1(八):分布式交换机配置(vMotion迁移网段)
查看>>
[转载] 中华典故故事(孙刚)——19 万岁
查看>>
修改hosts文件里面的主机名,oralce asm无法启动
查看>>
Maven学习总结(十)——使用Maven编译项目gbk的不可映射问题
查看>>
php5编译安装常见错误和解决办法集锦
查看>>