首页 > 系统 > Android > 正文

FragmentTabHost使用方法详解

2019-12-12 02:19:24
字体:
来源:转载
供稿:网友

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>

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

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表