FragmentTabHost使用方法详解

fragmenttabhost是support-v包下提供的用于集成和管理fragment页面的组件.

今天要实现的效果图如下:

整体结构是mainactivity+5个模块的fragment.

mainactivity的布局如下:

<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
 <!--真正的内容视图,用于展示fragment-->
 <framelayout
  android:id="@+id/real_tabcontent"
  android:layout_width="match_parent"
  android:layout_height="0dp"
  android:layout_weight="1"/>

 <!--tabhost,必须使用系统的id-->
 <android.support.v4.app.fragmenttabhost
  android:id="@android:id/tabhost"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  >
  <!--tabcontent,必须使用系统的id-->
  <framelayout
   android:id="@android:id/tabcontent"
   android:layout_width="0dp"
   android:layout_height="0dp"
   android:layout_weight="0"/>
 </android.support.v4.app.fragmenttabhost>

</linearlayout>

每个tab的布局如下:

<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:orientation="vertical">
 <!--tab图片-->
 <imageview
  android:id="@+id/iv_tab"
  android:layout_width="26dp"
  android:layout_height="26dp"
  />
 <!--tab名字-->
 <textview
  android:id="@+id/tv_tab"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_margintop="1dp"
  android:textsize="12sp"/>
</linearlayout>

mainactivity代码如下:

package blog.csdn.net.mchenys.bsbdj.modul.main;

import android.content.res.colorstatelist;
import android.os.bundle;
import android.support.v4.app.fragmenttabhost;
import android.text.textutils;
import android.view.view;
import android.widget.imageview;
import android.widget.tabhost;
import android.widget.textview;

import blog.csdn.net.mchenys.bsbdj.r;
import blog.csdn.net.mchenys.bsbdj.common.base.baseactivity;
import blog.csdn.net.mchenys.bsbdj.modul.attention.view.attentionfragment;
import blog.csdn.net.mchenys.bsbdj.modul.essence.view.essencefragment;
import blog.csdn.net.mchenys.bsbdj.modul.mine.view.minefragment;
import blog.csdn.net.mchenys.bsbdj.modul.newpost.view.newpostfragment;
import blog.csdn.net.mchenys.bsbdj.modul.publish.view.publishfragment;
import blog.csdn.net.mchenys.bsbdj.mvp.presenter.impl.mvpbasepresenter;
/**
 * created by mchenys on 2016/5/27.
 */
public class mainactivity extends baseactivity {

 //定义数组来存放tab的图片选择器
 private int[] mtabimage = {r.drawable.main_bottom_essence_selector,
   r.drawable.main_bottom_latest_selector,
   r.drawable.main_bottom_writeposts_selector,
   r.drawable.main_bottom_news_selector,
   r.drawable.main_bottom_my_selector};

 //tab选项卡的文字
 private string[] mtabtitle = {"精华", "新帖", "", "关注", "我的"};

 //每个tab对应的fragment的字节码对象
 private class[] fragmentarray = {essencefragment.class, newpostfragment.class,
   publishfragment.class, attentionfragment.class, minefragment.class};

 @override
 protected boolean ishomepage() {
  return true;
 }

 @override
 public integer getlayoutresid() {
  return r.layout.activity_main;
 }

 @override
 public void initview() {
  //获取tabhost
  fragmenttabhost tabhost = (fragmenttabhost) findviewbyid(android.r.id.tabhost);
  //绑定tabcontent
  tabhost.setup(this, getsupportfragmentmanager(), r.id.real_tabcontent);
  //去掉分割线
  tabhost.gettabwidget().setdividerdrawable(null);
  for (int i = 0; i < fragmentarray.length; i++) {
   //绑定fragment,添加到的fragmenttabhost
   //设置tab的名称和view
   tabhost.tabspec tabspec = tabhost.
     newtabspec(mtabtitle[i]).
     setindicator(gettabitemview(i));
   bundle bundle = new bundle();
   bundle.putstring("title", mtabtitle[i]);
   //添加tab和关联对应的fragment
   tabhost.addtab(tabspec, fragmentarray[i], bundle);
   //设置tab的背景色
   tabhost.gettabwidget().
     getchildat(i).
     setbackgroundcolor(getresources().getcolor(r.color.bgcolor));
  }
  //默认选中第一个tab
  tabhost.setcurrenttab(0);
  //设置tab的切换监听
  tabhost.setontabchangedlistener(new tabhost.ontabchangelistener() {
   @override
   public void ontabchanged(string tabid) {
    //可以在这里监听tab的切换
   }
  });
 }

 //tab的字体选择器
 colorstatelist mcolorstatelist;

 /**
  * 给tab按钮设置图标和文字
  */
 private view gettabitemview(int index) {
  view view = getlayoutinflater().inflate(r.layout.view_tab_indicator, null);
  imageview imageview = (imageview) view.findviewbyid(r.id.iv_tab);
  textview textview = (textview) view.findviewbyid(r.id.tv_tab);
  //设置图片选择器
  imageview.setimageresource(mtabimage[index]);
  //设置字体选择器
  if (mcolorstatelist == null) {
   mcolorstatelist = getresources().
     getcolorstatelist(r.color.main_bottom_text_selector);
   textview.settextcolor(mcolorstatelist);
  }
  //设置tab的文字
  if (textutils.isempty(mtabtitle[index])) {
   //如果没有名称,则隐藏tab下的textview
   textview.setvisibility(view.gone);
  } else {
   textview.setvisibility(view.visible);
   textview.settext(mtabtitle[index]);
  }
  return view;
 }


 @override
 public void initlistener() {

 }

 @override
 public void initdata() {

 }

 @override
 public void reloaddata() {

 }

 @override
 public void onclick(view v) {

 }

 @override
 public mvpbasepresenter bindpresenter() {
  return null;
 }
}

最后附上字体选择器

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:state_selected="false" android:color="@color/main_bottom_text_normal" />
 <item android:state_selected="true" android:color="@color/main_bottom_text_select" />
</selector>

图片选择器有5个,这里附上一个,其他类似:

<?xml version="1.0" encoding="utf-8"?>
<selector
 xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:state_selected="false" android:drawable="@drawable/main_bottom_essence_normal" />
 <item android:state_selected="true" android:drawable="@drawable/main_bottom_essence_press" />
</selector>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。