FragmentTabHost使用方法详解

发布时间 - 2026-01-11 02:38:41    点击率:

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>

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


# Android  # FragmentTabHost  # Android 使用FragmentTabhost代替Tabhost  # FragmentTabHost FrameLayout实现底部导航栏  # Android Fragment+FragmentTabHost组件实现常见主页面(仿微信新浪)  # 选择器  # 绑定  # 在这里  # 第一个  # 如果没有  # 新帖  # 大家多多  # 选项卡  # 背景色  # 分割线  # bsbdj  # modul  # tv_tab  # mchenys  # content  # ColorStateList  # TextView  # main  # import  # package 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: IOS倒计时设置UIButton标题title的抖动问题  软银砸40亿美元收购DigitalBridge 强化AI资料中心布局  如何实现javascript表单验证_正则表达式有哪些实用技巧  如何快速搭建FTP站点实现文件共享?  如何用AI帮你把自己的生活经历写成一个有趣的故事?  谷歌浏览器如何更改浏览器主题 Google Chrome主题设置教程  无锡营销型网站制作公司,无锡网选车牌流程?  如何基于云服务器快速搭建网站及云盘系统?  潮流网站制作头像软件下载,适合母子的网名有哪些?  logo在线制作免费网站在线制作好吗,DW网页制作时,如何在网页标题前加上logo?  教你用AI将一段旋律扩展成一首完整的曲子  浏览器如何快速切换搜索引擎_在地址栏使用不同搜索引擎【搜索】  高防服务器租用如何选择配置与防御等级?  Python制作简易注册登录系统  如何选择可靠的免备案建站服务器?  如何用西部建站助手快速创建专业网站?  Laravel中的withCount方法怎么高效统计关联模型数量  网站制作壁纸教程视频,电脑壁纸网站?  原生JS获取元素集合的子元素宽度实例  米侠浏览器网页背景异常怎么办 米侠显示修复  如何快速完成中国万网建站详细流程?  C++用Dijkstra(迪杰斯特拉)算法求最短路径  微信小程序 scroll-view组件实现列表页实例代码  Laravel如何实现全文搜索_Laravel Scout集成Algolia或Meilisearch教程  南京网站制作费用,南京远驱官方网站?  东莞市网站制作公司有哪些,东莞找工作用什么网站好?  高防服务器如何保障网站安全无虞?  Swift开发中switch语句值绑定模式  做企业网站制作流程,企业网站制作基本流程有哪些?  QQ浏览器网页版登录入口 个人中心在线进入  Laravel怎么配置.env环境变量_Laravel生产环境敏感数据保护与读取【方法】  如何在云主机快速搭建网站站点?  JavaScript中如何操作剪贴板_ClipboardAPI怎么用  Laravel怎么进行数据库事务处理_Laravel DB Facade事务操作确保数据一致性  简历没回改:利用AI润色让你的文字更专业  Laravel如何实现URL美化Slug功能_Laravel使用eloquent-sluggable生成别名【方法】  javascript基本数据类型及类型检测常用方法小结  再谈Python中的字符串与字符编码(推荐)  网站图片在线制作软件,怎么在图片上做链接?  文字头像制作网站推荐软件,醒图能自动配文字吗?  如何挑选优质建站一级代理提升网站排名?  javascript事件捕获机制【深入分析IE和DOM中的事件模型】  如何为不同团队 ID 动态生成多个非值班状态按钮  在线教育网站制作平台,山西立德教育官网?  如何快速搭建支持数据库操作的智能建站平台?  Java遍历集合的三种方式  Windows驱动无法加载错误解决方法_驱动签名验证失败处理步骤  Python结构化数据采集_字段抽取解析【教程】  *服务器网站为何频现安全漏洞?  免费视频制作网站,更新又快又好的免费电影网站?