大部分APP的主界面都很类似,要么底部导航的,要么就是侧滑菜单,还有底部导航+侧滑菜单的;底部导航实现大概有几种方式:

  • TabHost+Fragment
  • RadioGroup+Fragment
  • FragmentTabHost+Fragment
  • BottomNavigator+Fragment

今天说一下FragmentTabHost+Fragment实现方式(布局文件在最下面):

1、定义一个TabBean,存放每个tab;

public class TabBean {
private int title; // 文字
private int icon; // 图标
private Class fragment; // 对应fragment public TabBean(Class fragment, int title, int icon ) {
this.title = title;
this.icon = icon;
this.fragment = fragment;
} public int getTitle() {
return title;
} public void setTitle(int title) {
this.title = title;
} public int getIcon() {
return icon;
} public void setIcon(int icon) {
this.icon = icon;
} public Class getFragment() {
return fragment;
} public void setFragment(Class fragment) {
this.fragment = fragment;
}
}

2、初始化数据集合

  private List<TabBean> mTabs = null;
private void initData() {
mTabs = new ArrayList();
mTabs.add(new TabBean(HomeFragment.class,R.string.home,R.mipmap.ic_launcher_round));
mTabs.add(new TabBean(HotFragment.class,R.string.hot,R.mipmap.ic_launcher_round));
mTabs.add(new TabBean(CategoryFragment.class,R.string.category,R.mipmap.ic_launcher_round));
mTabs.add(new TabBean(CartFragment.class,R.string.cart,R.mipmap.ic_launcher_round));
mTabs.add(new TabBean(MineFragment.class,R.string.mine,R.mipmap.ic_launcher_round));
}

3、实例化控件,设置数据;

    private void initView() {
mTabHost.setup(this,getSupportFragmentManager(),R.id.flContent); for(TabBean tab : mTabs){
TabHost.TabSpec tabSpec = mTabHost.newTabSpec(getString(tab.getTitle()));
tabSpec.setIndicator(buildIndicator(tab));
tabSpec.setContent(new TabHost.TabContentFactory() {
@Override
public View createTabContent(String s) {
return new View(MainActivity.this);
}
});
mTabHost.addTab(tabSpec,tab.getFragment(),null);
} mTabHost.setCurrentTab(0); //默认选中 mTabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener() {
@Override
public void onTabChanged(String tabTitle) {
//修改选中Tab的样式(类似状态选择器)
TabWidget tabw = mTabHost.getTabWidget();
for (int i = 0; i < tabw.getChildCount(); i++) {
View view = tabw.getChildAt(i);
TextView tv = (TextView) view.findViewById(R.id.tab_title);
if (i == mTabHost.getCurrentTab()) {
tv.setTextColor(getResources().getColor(R.color.colorAccent));
} else {
tv.setTextColor(getResources().getColor(R.color.textColor));
} }
}
});
}
//构建Indicator
private View buildIndicator(TabBean tab){
View view = LayoutInflater.from(this).inflate(R.layout.tab_indicator,null);
ImageView img = (ImageView) view.findViewById(R.id.tab_icon);
TextView text = (TextView) view.findViewById(R.id.tab_title);
img.setBackgroundResource(tab.getIcon());
text.setText(tab.getTitle());
return view;
}

完成了!!! 下面是布局文件(界面的和tab的)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity"> <FrameLayout
android:id="@+id/flContent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"></FrameLayout> <android.support.v4.app.FragmentTabHost
android:id="@+id/tabHost"
android:layout_width="match_parent"
android:layout_height="48dp">
</android.support.v4.app.FragmentTabHost>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:descendantFocusability="afterDescendants"
android:paddingBottom="4dp"
android:paddingTop="6dp"> <ImageView
android:id="@+id/tab_icon"
android:layout_width="22dp"
android:layout_height="22dp"
android:layout_centerHorizontal="true"
tools:ignore="ContentDescription" /> <TextView
android:id="@+id/tab_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/tab_icon"
android:layout_centerHorizontal="true"
android:clickable="false"
android:enabled="false"
android:focusable="false"
android:gravity="center"
android:textColor="@color/textColor"
android:textSize="12sp"
tools:text="tab" /> </RelativeLayout>

FragmentTabHost这个控件每次切换Fragment,都会走Fragment的onCreateView和onDestroyView方法,多以每次切换都会创建和销毁Fragment实例,下篇文章说一下自定义FragmentTabHost避免重复创建和销毁Fragment实例,让Fragment隐藏hide和显示show;FragmentTabHost切换Fragment时保存状态,避免切换Fragment走onCreateView和onDestroyView方法;

Android控件使用FragmentTabHost,切换Fragment;的更多相关文章

  1. Android控件Gridview实现仿支付宝首页,Fragment底部按钮切换和登录圆形头像

    此案例主要讲的是Android控件Gridview(九宫格)完美实现仿支付宝首页,包含添加和删除功能:Fragment底部按钮切换的效果,包含四个模块,登录页面圆形头像等,一个小项目的初始布局. 效果 ...

  2. Android控件Gridview实现多个menu模块,可添加可删除

    此案例主要讲的是Android控件Gridview(九宫格)完美实现仿支付宝首页,包含添加和删除功能:Fragment底部按钮切换的效果,包含四个模块,登录页面圆形头像等,一个小项目的初始布局. 效果 ...

  3. 让多个Fragment 切换时不重新实例化、FragmentTabHost切换Fragment时避免UI重新加载

    http://www.tuicool.com/articles/FJ7VBb FragmentTabHost切换Fragment时避免UI重新加载 不过,初次实现时发现有个缺陷,每次FragmentT ...

  4. android控件的属性

    android控件的属性 本节描述android空间的位置,内容等相关属性及属性的含义 第一类:属性值为true或false android:layout_centerHrizontal 水平居中 ( ...

  5. Android控件之ImageSwticher

    Android控件之ImageSwticher 1. ImageSwticher介绍 ImageSwitcher是图片切换的控件,它能实现图片切换时的动画效果,包括图片导入效果.图片消失效果等等.An ...

  6. [Android Pro] android控件ListView顶部或者底部也显示分割线

    reference to  :  http://blog.csdn.net/lovexieyuan520/article/details/50846569 在默认的Android控件ListView在 ...

  7. Android 控件架构及View、ViewGroup的测量

    附录:示例代码地址 控件在Android开发的过程中是必不可少的,无论是我们在使用系统控件还是自定义的控件.下面我们将讲解一下Android的控件架构,以及如何实现自定义控件. 1.Android控件 ...

  8. Android - 控件android:ems属性

    Android - 控件android:ems属性http://blog.csdn.net/caroline_wendy/article/details/41684255?utm_source=tui ...

  9. Android 控件知识点,

    一.Android控件具有visibility属性,可以取三个值:visible(默认值)可见,invisible(不可见,但仍然占据原有的位置和大小,可以看做是变得透明了),gone(空间不仅不可见 ...

随机推荐

  1. mysql - 缺失范围和连续范围

    初始化数据 # 创建表 DROP TABLE IF EXISTS g; CREATE TABLE g( a INT )ENGINE=INNODB; # 初始化数据 ; ; ; ; ; ; ; ; ; ...

  2. Nhibernate的介绍

    1.介绍的内容 1.感谢园友的文章支持 by 李永京 by wolfy 2.Nhibernate的框架介绍 3.Nhibernate的架构介绍 4.Nhibernate映射方法介绍(该点自己也存在一定 ...

  3. vs多项目模板及add-in开发

    本文分2部分 第一为自定义多项目模板 第二为vs add-in开发 效果图 1.自定义模板 2. 工具菜单 3.窗口 4.工程 5.文件 ... 一. 多项目模板 单项目模板做起来很简单 选中一个项目 ...

  4. MYSQL C API : mysql_real_query()

    enum enum_field_types { MYSQL_TYPE_DECIMAL, MYSQL_TYPE_TINY, MYSQL_TYPE_SHORT, MYSQL_TYPE_LONG, MYSQ ...

  5. POJ3080 - Blue Jeans(KMP+二分)

    题目大意 求N个字符串的最长公共字串 题解 和POJ1226做法一样...注意是字典序最小的...WA了一次 代码: #include <iostream> #include <cs ...

  6. JS 利用数组拼接html字符串

    var cc = []; cc.push('<td colspan=' + fields.length + ' style="padding:10px 5px;border:0;&qu ...

  7. php的冒泡算法

    <?php /* 冒泡算法  * @para $arr 传人进去排序的数组  * @return $newArr 排序之后的数组  */   function maopao($arr){     ...

  8. 基于Grunt的版本号构建系统新手教程

    作者:zhanhailiang 日期:2014-10-12 1. 安装nodejs,npm,grunt-cli.參见<Windows环境下安装nodejs+npm+grunt-cli工具> ...

  9. UTC、GTC时间和本地时间

    1.问题 对于装有Windows和Linux系统的机器,进入Windows显示的时间和Linux不一致,Linux中的时间比Windows提前8个小时. 2.解决方法 修改/etc/default/r ...

  10. c# 关于字段内存排序

    关键字:StructLayout.LayoutKind.Explicit.FieldOffset [StructLayout(LayoutKind.Explicit)] public class AA ...