当前位置：移动技术网 > IT编程>移动开发>Android > Android组件必学之TabHost使用方法详解

Android组件必学之TabHost使用方法详解

2019年07月24日 | 移动技术网IT编程 | 我要评论

胡莱三国汉铢,电脑反应慢的原因,母牛产下龙凤胎

一、tabhost用法
通常情况下我们会通过继承tabactivity，调用gettabhost()获取tabhost实例,下面是具体过程。
tabhostactivity.java

public class tabhostactivity extends tabactivity {
 private tabhost tabhost;
 private intent certificateintent;
 private intent feeintent;
 private intent scoreintent;
 private intent studyintent;
 private intent moreintent;
 
 @override
 publicvoid oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  tabhost = gettabhost();
  initintent();
  addspec();
 }
 /**
  * 初始化各个tab标签对应的intent
  */
 privatevoid initintent() {
  studyintent = new intent(this, studyactivity.class);
  scoreintent = new intent(this, scoreactivity.class);
  feeintent = new intent(this, feeactivity.class);
  certificateintent = new intent(this, certificateactivity.class);
  moreintent = new intent(this, moreactivity.class);
 }
 /**
  * 为tabhost添加各个标签项
  */
 privatevoid addspec() {
  tabhost.addtab(this.buildtagspec("tab_study",
r.string.study_progress,r.drawable.account01, studyintent));
 tabhost.addtab(this.buildtagspec("tab_score",
r.string.test_score,r.drawable.account02, scoreintent));
  tabhost.addtab(this.buildtagspec("tab_fee",
r.string.fee_pay,r.drawable.account03, feeintent));
  tabhost.addtab(this.buildtagspec("tab_certificate", r.string.certificate_grant,r.drawable.accountcertificateintent));
  tabhost.addtab(this.buildtagspec("tab_more", r.string.more,
    r.drawable.account05, moreintent));
 }
 /**
  * 自定义创建标签项的方法
  * @param tagname 标签标识
  * @param taglable 标签文字
  * @param icon 标签图标
  * @param content 标签对应的内容
  * @return
  */
 private tabhost.tabspec buildtagspec(string tagname, int taglable,
   int icon, intent content) {
  returntabhost
    .newtabspec(tagname)
    .setindicator(getresources().getstring(taglable),
      getresources().getdrawable(icon)).setcontent(content);
 }}

运行结果如下图所示

我们发现标签位置处于界面上方，但是我们看到的很多应用的标签都处于界面底部。
如下图所示

我们要实现这种效果只需要将tabactivity的默认布局覆盖即可。新布局只需将标签和标签对应内容的相对位置调换一下就可以了，这里是用相对布局将标签对应内容的位置放到了标签的上方。不要改动id（会抛异常，提示必须要用指定的id）。不要忘了在oncreate()里设置新布局将tabactivity的默认布局覆盖。

 @override
 publicvoid oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
setcontentview(r.layout.tab);
  tabhost = gettabhost();
  initintent();
  addspec();
 }

tab.xml

<?xml version="1.0" encoding="utf-8"?>
<!-- tabhost组件id值不可变-->
<tabhostxmlns:android=http://schemas.android.com/apk/res/android
 android:id="@android:id/tabhost"
 android:layout_height="fill_parent"
 android:layout_width="fill_parent">
 
 <relativelayout android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
  
  <!-- tabwidget组件id值不可变-->
  <tabwidget android:id="@android:id/tabs"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:layout_alignparentbottom="true">
  </tabwidget>
  
  <!-- framelayout布局，id值不可变-->
  <framelayout android:id="@android:id/tabcontent"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:layout_above="@android:id/tabs">
  </framelayout>
  
 </relativelayout>
</tabhost>

通常在项目中我们都会有一个自定义的activity基类，我们会让所有的界面activity去继承这个基类。但是要使用tabhost就要继承tabactivity，所以我们可以定义两个基类，一个是普通activity界面的基类，另一个是包含tabhost界面的基类，让这个基类继承tabactivity即可。
二、tabhost用法—定义tab标签样式
第一节“tabhost用法”中我们介绍了通过tabhost实现标签页效果。但是在实际项目中我们可能更希望定义自己的tab标签样式使界面效果更佳。既然不能改变系统的tab样式，那么我们可以选择隐藏系统的东西，使用自己定义的东西（这种方式很好用，以后会详细介绍）。反编译新浪微博的项目后会发现，他们在布局中隐藏了tabwidget即tab标签而使用一组radiobutton来代替。既然是自己定义的，那肯定是可以自己决定显示样式了，那我们的问题也就解决了。

这里我使用的是“tabhost用法—两种实现方式”一文种提到的第二种实现方式，继承activity来使用tabhost的。先把代码贴上来（红色字体部分为修改或添加的代码）。
tabhostactivity.java

public class tabhostactivity extends activity implements
  oncheckedchangelistener {
 private tabhost tabhost;

 
 private intent certificateintent;
 private intent feeintent;
 private intent scoreintent;
 private intent studyintent;
 private intent moreintent;
 
 @override
 publicvoid oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  setcontentview(r.layout.tab);
  // tabhost = gettabhost();
  tabhost = (tabhost) findviewbyid(r.id.my_tabhost);
  localactivitymanager groupactivity =
new localactivitymanager(this,false);
  groupactivity.dispatchcreate(savedinstancestate);
  tabhost.setup(groupactivity);
  initintent();
  addspec();
  ((radiogroup) findviewbyid(r.id.tab_radiogroup))
    .setoncheckedchangelistener(this);
 
 }
 
 /**
  * 初始化各个tab标签对应的intent
  */
 privatevoid initintent() {
  studyintent = new intent(this, studyactivity.class);
  scoreintent = new intent(this, scoreactivity.class);
  feeintent = new intent(this, feeactivity.class);
  certificateintent = new intent(this, certificateactivity.class);
  moreintent = new intent(this, moreactivity.class);
 }
 
 /**
  * 为tabhost添加各个标签项
  */
 privatevoid addspec() {
tabhost.addtab(this.buildtagspec("tab_study", r.string.study_progress,
    r.drawable.account01, studyintent));
tabhost.addtab(this.buildtagspec("tab_score", r.string.test_score,
    r.drawable.account02, scoreintent));
  tabhost.addtab(this.buildtagspec("tab_fee", r.string.fee_pay,
    r.drawable.account03, feeintent));
  tabhost.addtab(this.buildtagspec("tab_certificate",
    r.string.certificate_grant, r.drawable.account04,
    certificateintent));
  tabhost.addtab(this.buildtagspec("tab_more", r.string.more,
    r.drawable.account05, moreintent));
 }
 
 /**
  * 自定义创建标签项的方法
  * @param tagname 标签标识
  * @param taglable 标签文字
  * @param icon 标签图标
  * @param content 标签对应的内容
  * @return
  */
 private tabhost.tabspec buildtagspec(string tagname, int taglable,
   int icon, intent content) {
  returntabhost
    .newtabspec(tagname)
    .setindicator(getresources().getstring(taglable),
      getresources().getdrawable(icon)).setcontent(content);
 }
 
 @override
 public void oncheckedchanged(radiogroup group, int checkedid) {
  switch (checkedid) {
  case r.id.radio_button_study:
   tabhost.setcurrenttabbytag("tab_study");
   break;
  case r.id.radio_button_score:
   tabhost.setcurrenttabbytag("tab_score");
   break;
  case r.id.radio_button_certificate:
   tabhost.setcurrenttabbytag("tab_certificate");
   break;
  case r.id.radio_button_fee:
   tabhost.setcurrenttabbytag("tab_fee");
   break;
  case r.id.radio_button_more:
   tabhost.setcurrenttabbytag("tab_more");
   break;
  }
 
 }
}

tab.xml

<?xml version="1.0" encoding="utf-8"?>
<tabhost android:id="@+id/my_tabhost" android:layout_width="fill_parent"
   android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android">
 <linearlayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
  <framelayout android:id="@android:id/tabcontent"
     android:layout_width="fill_parent" android:layout_height="0.0dip"
      android:layout_weight="1.0" />
<tabwidget android:id="@android:id/tabs" android:visibility="gone"
android:layout_width="fill_parent" android:layout_height="wrap_content"
     android:layout_weight="0.0" />
  <radiogroup android:id="@+id/tab_radiogroup"
    android:background="@drawable/tabs_bg" android:layout_width="fill_parent"
   android:layout_height="wrap_content" android:gravity="center_vertical"
   android:layout_gravity="bottom" android:orientation="horizontal">
   <radiobutton android:id="@+id/radio_button_study"
    android:layout_margintop="2.0dip" android:text="学习进度"
    android:drawabletop="@drawable/account01" style="@style/tab_button_bottom"
    android:checked="true" />
   <radiobutton android:id="@+id/radio_button_score"
    android:layout_margintop="2.0dip" android:text="考试成绩"
    android:drawabletop="@drawable/account02" style="@style/tab_button_bottom" />
   <radiobutton android:id="@+id/radio_button_certificate"
    android:layout_margintop="2.0dip" android:text="证书发放"
    android:drawabletop="@drawable/account03" style="@style/tab_button_bottom" />
   <radiobutton android:id="@+id/radio_button_fee"
    android:layout_margintop="2.0dip" android:text="费用缴纳"
    android:drawabletop="@drawable/account04" style="@style/tab_button_bottom" />
   <radiobutton android:id="@+id/radio_button_more"
    android:layout_margintop="2.0dip" android:text="更多"
    android:drawabletop="@drawable/account05" style="@style/tab_button_bottom" />
  </radiogroup>
 </linearlayout>
</tabhost>

styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <!-- tabhost标签按钮样式 -->
 <style name="tab_button_bottom">
  <item name="android:textsize">12px</item>
  <item name="android:textcolor">#ffffffff</item>
  <item name="android:ellipsize">marquee</item>
  <item name="android:gravity">center_horizontal</item>
  <item name="android:background">@drawable/tab_btn_bg</item>
  <item name="android:layout_margintop">2.0dip</item>
  <item name="android:button">@null</item>
  <item name="android:paddingtop">6dip</item>
  <item name="android:drawablepadding">4dip</item>
  <item name="android:layout_width">fill_parent</item>
  <item name="android:layout_height">wrap_content</item>
  <item name="android:layout_weight">1.0</item>
  <item name="android:singleline">true</item>
 </style>
 
 <!-- 页面标题linearlayout样式 -->
 <style name="activity_title_background">
 <item name="android:background">@drawable/title_background</item>
  <item name="android:layout_width">fill_parent</item>
  <item name="android:layout_height">wrap_content</item>
  <item name="android:layout_alignparenttop">true</item>
  <item name="android:gravity">center</item>
 </style>
 
 <!-- 界面标题textview样式 -->
 <style name="activity_title_text">
  <item name="android:textsize">14dip</item>
  <item name="android:textcolor">@drawable/white</item>
  <item name="android:layout_width">wrap_content</item>
  <item name="android:layout_height">wrap_content</item>
  <item name="android:gravity">center</item>
 </style>
</resources>

运行结果如下图所示

程序重要部分：
1. 红色字体部分。
2. 布局文件tab.xml,可以看到该布局文件中将tabwidget隐藏（android:visibility="gone"）而以一个radiogroup取而代之。
3. 为radiogroup设置oncheckedchangelistener监听，通过oncheckedchanged方法对各个radiobutton点击事件的处理完成标签切换。

其实我当初考虑过为什么要用radiobutton而不用普通的button。后来通过自己做项目，发现使用radiogroup有以下优点：
1.另外就是布局上比较方便易懂，不用再去用linearlayout等布局去包含button。
2. 我们可以很方便的获得当前选中的标签，当然通过tabhost的tabhost.getcurrenttabtag()和getcurrenttab()也是可以的。
3.设置监听很方便，只需要为radiogroup设置监听就行了，程序中对应的代码是

((radiogroup) findviewbyid(r.id.tab_radiogroup))
       .setoncheckedchangelistener(this);

如果用button的话我们需要为所有的button一个一个去设置监听，相对来说比较麻烦。
4. 或许最重要的一点是因为radiobutton本身就支持图片和文字的上下布局，只需指定图片和文字是什么就可以了而不需要我们自己去实现这种布局。

<radiobutton android:id="@+id/radio_button_more"
   android:layout_margintop="2.0dip"
android:text="更多"
   android:drawabletop="@drawable/account05"
   style="@style/tab_button_bottom" />

当然如果如果radiobutton不能满足我们的项目需求，比如我们不需要图片又不想让文字靠底部显示，而是居中显示，这时我们就可以用其他组件代替radiobutton。其实我们可以通过修改或自定义等方式实现多种漂亮的效果，比如“人人网”手机客户端的个人主页中tab标签是可以左右滑动的。

原创作者：男人应似海

以上就是本文的全部内容，希望能给大家一个参考，也希望大家多多支持移动技术网。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！点击进行留言回复

android的布局（如何实现空心圆效果的布局）

layer-list : 简单来说layer-list就是图层列表的意思,是用来创建LayerDrawable的,LayerDrawable是Drawa... [阅读全文]
Android 极光推送别名与标签方式

android 极光推送别名、标签、registrationid说明别名（alias）为安装了应用程序的用户，取个别名来标识。以后给该用户 push 消息时，... [阅读全文]
Dialog全屏,去掉状态栏的方式

dialog即使设置全屏了，但还是有状态栏占用高度这；直接将下面这行代码放到你的dialog中即可 @override protected void onsta... [阅读全文]
Android Manifest中meta-data扩展元素数据的配置与获取方式

在androidmanifest.xml清单文件中我们有时会看到如下类似的<meta-data ... >元素开始的配置内容：<meta-d... [阅读全文]
Android实现获取meta-data和build.gradle的值

有时候会用到meta-data中的参数，比如定义的渠道号，类似友盟统计。也会用到定义在build.gradle文件中android标签下的defaultconf... [阅读全文]
Android获取清单文件中的meta-data,解决碰到数值为null的问题

1.meta-data是什么？如何获取meta-data？在androidmanifest.xml中，元素可以作为子元素，被包在activity、applica... [阅读全文]
解决webview 第二次调用loadUrl页面不刷新的问题

一个需求，当点击button按钮时，希望加载另一个url。以下方法可以成功！@overridepublic void onclick(view view) { ... [阅读全文]
浅谈 Android 7.0 多窗口分屏模式的实现

从 android 7.0 开始，google 推出了一个名为“多窗口模式”的新功能，也就是我们常说的“分屏模式”。那么，这个功能有什么用呢？作为开发者，我们又... [阅读全文]
解决Android WebView拦截url,视频播放加载失败的问题

需求：android调用webview加载网页的时候，拦截某一个链接不执行此链接，执行指定跳转到其他activity页面。webview的setwebviewc... [阅读全文]
Android webview加载https链接错误或无响应的解决

最近做无线wifi的时候，在最后认证成功的时候会弹出一个广告页，于是用webview去加载了一下，结果没反应，打印url出来看了一下，发现是https格式的，在... [阅读全文]

网友评论


验证码：

Android组件必学之TabHost使用方法详解

2019年07月24日 | 移动技术网IT编程 | 我要评论

您可能感兴趣的文章:

相关文章:

网友评论