当前位置: 移动技术网 > 移动技术>移动开发>Android > 实例讲解Android应用开发中TabHost的使用要点

实例讲解Android应用开发中TabHost的使用要点

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

tab与tabhost:

2016415145730178.png (319×94)

这就是tab,而盛放tab的容器就是tabhost 。
如何实现??
每一个tab还对应了一个布局,这个就有点好玩了。一个activity,对应了多个功能布局。
新建一个tab项目,注意,不要生成main activity 。

2016415145821998.png (120×103)

注意ide,这里不要选...
在包里面新建一个类mytab,继承于tabactivity。
其实,tabactivity是activity的子类

package zyf.tab.test;
 
import android.app.tabactivity;
 
public class mytab extends tabactivity {
 
}

从父类继承oncreate()入口方法

package zyf.tab.test;
import android.app.tabactivity;
import android.os.bundle;
public class mytab extends tabactivity {
  @override
  protected void oncreate(bundle savedinstancestate) {
    // todo auto-generated method stub
    super.oncreate(savedinstancestate);
  }
}

在manifest.xml文件中注册一下mytab类(activity)

<activity android:name=".mytab">
  <intent-filter>
    <action android:name="android.intent.action.main"></action>
    <category android:name="android.intent.category.launcher"></category>
  </intent-filter>
</activity>

这时候,需要设计一下标签页对应的布局,一般采用framelayout作为根布局,每个标签页面对应一个子节点的layout

<?xml version="1.0" encoding="utf-8"?>
<!-- 这里是根节点布局 -- >
<framelayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent" android:layout_height="fill_parent">
 
<!-- 第一个tab 对应的布局 -- >
  <linearlayout android:id="@+id/widget_layout_blue"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    androidrientation="vertical" >
    <edittext android:id="@+id/widget34" android:layout_width="fill_parent"
      android:layout_height="wrap_content" android:text="edittext"
      android:textsize="18sp">
    </edittext>
    <button android:id="@+id/widget30" android:layout_width="wrap_content"
      android:layout_height="wrap_content" android:text="button">
    </button>
  </linearlayout>
<!-- 第二个tab 对应的布局 -- >
  <linearlayout android:id="@+id/widget_layout_red"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    androidrientation="vertical" >
    <analogclock android:id="@+id/widget36"
      android:layout_width="wrap_content" android:layout_height="wrap_content">
    </analogclock>
  </linearlayout>
<!-- 第三个tab 对应的布局 -- >
  <linearlayout android:id="@+id/widget_layout_green"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    androidrientation="vertical">
    <radiogroup android:id="@+id/widget43"
      android:layout_width="166px" android:layout_height="98px"
      androidrientation="vertical">
      <radiobutton android:id="@+id/widget44"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:text="radiobutton">
      </radiobutton>
      <radiobutton android:id="@+id/widget45"
        android:layout_width="wrap_content" android:layout_height="wrap_content"
        android:text="radiobutton">
      </radiobutton>
    </radiogroup>
  </linearlayout>
</framelayout>

首先,应该声明tabhost,然后用layoutinflater过滤出布局来,给tabhost加上含有tab页面的framelayout

private tabhost mytabhost;
mytabhost=this.gettabhost();//从tabactivity上面获取放置tab的tabhost
layoutinflater.from(this).inflate(r.layout.main, mytabhost.gettabcontentview(), true);
//from(this)从这个tabactivity获取layoutinflater
//r.layout.main 存放tab布局
//通过tabhost获得存放tab标签页内容的framelayout
//是否将inflate 拴系到根布局元素上
mytabhost.setbackgroundcolor(color.argb(150, 22, 70, 150));
//设置一下tabhost的颜色

接着,在tabhost创建一个标签,然后设置一下标题/图标/标签页布局

mytabhost.addtab(mytabhost.newtabspec("tt")// 制造一个新的标签tt
   .setindicator("kk",getresources().getdrawable(r.drawable.ajjc))
            // 设置一下显示的标题为kk,设置一下标签图标为ajjc
            .setcontent(r.id.widget_layout_red));
    //设置一下该标签页的布局内容为r.id.widget_layout_red,这是framelayout中的一个子layout

标签切换事件处理,setontabchangedlistener

mytabhost.setontabchangedlistener(new ontabchangelistener(){
      @override
      public void ontabchanged(string tabid) {
        // todo auto-generated method stub
      }      
    });

各个标签页的动态menu
先把在xml中设计好的menu放到一个int数组里

private static final int mymenuresources[] = { r.menu.phonebook_menu,
      r.menu.addphone_menu, r.menu.chatting_menu, r.menu.userapp_menu };

在setontabchangedlistener()方法中根据标签的切换情况来设置mymenusettingtag

override
  public void ontabchanged(string tagstring) {
    // todo auto-generated method stub
    if (tagstring.equals("one")) {
      mymenusettingtag = 1;
    }
    if (tagstring.equals("two")) {
      mymenusettingtag = 2;
    }
    if (tagstring.equals("three")) {
      mymenusettingtag = 3;
    }
    if (tagstring.equals("four")) {
      mymenusettingtag = 4;
    }
    if (mymenu != null) {
      oncreateoptionsmenu(mymenu);
    }
  }

然后oncreateoptionsmenu(menu menu) 方法中通过menuinflater过滤器动态加入menu

  @override
  public boolean oncreateoptionsmenu(menu menu) {
    // todo auto-generated method stub
    // hold on to this
    mymenu = menu;
    mymenu.clear();//清空menu菜单
    // inflate the currently selected menu xml resource.
    menuinflater inflater = getmenuinflater();    
//从tabactivity这里获取一个menu过滤器
    switch (mymenusettingtag) {
    case 1:
      inflater.inflate(mymenuresources[0], menu);
      //动态加入数组中对应的xml menu菜单
      break;
    case 2:
      inflater.inflate(mymenuresources[1], menu);
      break;
    case 3:
      inflater.inflate(mymenuresources[2], menu);
      break;
    case 4:
      inflater.inflate(mymenuresources[3], menu);
      break;
    default:
      break;
    }
    return super.oncreateoptionsmenu(menu);
  }

menu 布局

<?xml version="1.0" encoding="utf-8"?>
<menu
 xmlns:android="http://schemas.android.com/apk/res/android">
<group android:id="@+id/group_a"><item android:id="@+id/item_a" android:icon="@drawable/gimp" android:title="gimp"></item>
</group>
</menu>

运行效果

2016415150019730.png (320×480)

2016415150042317.png (320×480)

2016415150100038.png (320×480)

模仿微信导航实例:

2016415150122927.png (480×854)

<?xml version="1.0" encoding="utf-8"?> 
<tabhost xmlns:android="http://schemas.android.com/apk/res/android" 
  android:id="@android:id/tabhost" 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" > 
 
  <linearlayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" > 
 
    <framelayout 
      android:id="@android:id/tabcontent" 
      android:layout_width="match_parent" 
      android:layout_height="0.0dip" 
      android:layout_weight="1.0" > 
    </framelayout> 
 
    <tabwidget 
      android:id="@android:id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:visibility="gone" > 
    </tabwidget> 
 
    <radiogroup 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_gravity="bottom" 
      android:background="@android:color/black" 
      android:orientation="horizontal" > 
 
      <radiobutton 
        android:id="@+id/talk" 
        style="@style/rbt_bottom" 
        android:drawabletop="@drawable/take_bottom" 
        android:text="@string/talk" /> 
 
      <radiobutton 
        android:id="@+id/address" 
        style="@style/rbt_bottom" 
        android:drawabletop="@drawable/adrress_bottom" 
        android:text="@string/address" /> 
 
      <radiobutton 
        android:id="@+id/find" 
        style="@style/rbt_bottom" 
        android:drawabletop="@drawable/find_bottom" 
        android:text="@string/find" /> 
 
      <radiobutton 
        android:id="@+id/me" 
        style="@style/rbt_bottom" 
        android:drawabletop="@drawable/me_bottom" 
        android:text="@string/me" /> 
    </radiogroup> 
  </linearlayout> 
 
</tabhost> 

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 
 
  <item android:drawable="@drawable/n_address_l" android:state_checked="true" android:state_enabled="true"/> 
  <item android:drawable="@drawable/n_address_h"/> 
 
</selector> 

package com.android.xiong.bkclient; 
 
import android.app.tabactivity; 
import android.content.intent; 
import android.os.bundle; 
import android.widget.compoundbutton; 
import android.widget.compoundbutton.oncheckedchangelistener; 
import android.widget.radiobutton; 
import android.widget.tabhost; 
 
@suppresswarnings("deprecation") 
public class mainactivity extends tabactivity implements 
    oncheckedchangelistener { 
 
  private tabhost tabhost; 
  private intent addressintent; 
  private intent meintent; 
  private intent takeintent; 
  private intent findintent; 
 
  private radiobutton findbt; 
  private radiobutton addressbt; 
  private radiobutton mebt; 
  private radiobutton takebt; 
 
  @override 
  protected void oncreate(bundle savedinstancestate) { 
    super.oncreate(savedinstancestate); 
    setcontentview(r.layout.tabhostmain); 
    addressintent = new intent(this, addressactivity.class); 
    meintent = new intent(this, meactivity.class); 
    takeintent = new intent(this, takeactivity.class); 
    findintent = new intent(this, findactivity.class); 
    findbt = (radiobutton) findviewbyid(r.id.find); 
    addressbt = (radiobutton) findviewbyid(r.id.address); 
    mebt = (radiobutton) findviewbyid(r.id.me); 
    takebt = (radiobutton) findviewbyid(r.id.talk); 
    tabhost =gettabhost(); 
    tabhost.addtab(tabhost.newtabspec("take").setindicator("take") 
        .setcontent(takeintent)); 
    tabhost.addtab(tabhost.newtabspec("address").setindicator("address") 
        .setcontent(addressintent)); 
    tabhost.addtab(tabhost.newtabspec("find").setindicator("find") 
        .setcontent(findintent)); 
    tabhost.addtab(tabhost.newtabspec("me").setindicator("me") 
        .setcontent(meintent)); 
    findbt.setoncheckedchangelistener(this); 
    mebt.setoncheckedchangelistener(this); 
    takebt.setoncheckedchangelistener(this); 
    addressbt.setoncheckedchangelistener(this); 
  } 
 
  @override 
  public void oncheckedchanged(compoundbutton view, boolean ischeak) { 
    if (ischeak) { 
      switch (view.getid()) { 
      case r.id.talk: 
        tabhost.setcurrenttabbytag("take"); 
        break; 
      case r.id.find: 
        tabhost.setcurrenttabbytag("find"); 
        break; 
      case r.id.me: 
        tabhost.setcurrenttabbytag("me"); 
        break; 
      case r.id.address: 
        tabhost.setcurrenttabbytag("address"); 
        break; 
      default: 
        break; 
      } 
    } 
 
  } 
} 


<manifest xmlns:android="http://schemas.android.com/apk/res/android" 
  package="com.android.xiong.bkclient" 
  android:versioncode="1" 
  android:versionname="1.0" > 
 
  <uses-sdk 
    android:minsdkversion="8" 
    android:targetsdkversion="19" /> 
 
  <application 
    android:allowbackup="true" 
    android:icon="@drawable/ic_launcher" 
    android:label="@string/app_name" 
    android:theme="@style/apptheme" > 
    <activity android:name="com.android.xiong.bkclient.mainactivity"> 
      <intent-filter> 
        <action android:name="android.intent.action.main" /> 
 
        <category android:name="android.intent.category.launcher" /> 
      </intent-filter> 
    </activity> 
    <activity android:name="com.android.xiong.bkclient.addressactivity"></activity> 
    <activity android:name="com.android.xiong.bkclient.findactivity"></activity> 
    <activity android:name="com.android.xiong.bkclient.meactivity"></activity> 
    <activity android:name="com.android.xiong.bkclient.takeactivity"></activity> 
  </application> 
 
</manifest> 

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网