利用Fragment和FragmentTabHost实现各类app底部菜单栏

   当我们打开一个app时，你会发现，为了扩宽app的功能，几乎每一个app都使用了底部菜单栏。接下来让我们一起来学习如何搭建一个属于自己的底部菜单栏吧。

   在android4.0之前，实现底部菜单栏是通过TabActivity，在4.0之后使用Fragment来代替该类的开发。舍弃原因大家可以看我给出的参考文章。

   首先，创建一个项目，再activity.xml中编写布局，一开始如果不太熟悉，可以在视图中拖拽TabHost，如下图所示

   其形成的TabHost布局如下

   但是，我们使用不是TabHost，我们只需要在布局中改变<TabHost标签即可。一开始的布局给定3个按钮子项，由于在开发中可能是多个，所以需要动态添加，此时在布局中删除这些三个布局控件。如下所示

  形成的ui视图如下

 注意，此时我们还没有改变<TabHost的标签，在这建议先把布局调好，在改标签，因为一旦我们改了根标签后，在ui视图中无法看到。

  接着修改布局，让TabWidget放置到下面，最终的.xml布局如下

<?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:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.android.welcomesplash.MainActivity">
    <android.support.v4.app.FragmentTabHost
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/tabHost"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">


            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="0dp">
            </FrameLayout>
            <TabWidget
                 android:background="#ffffff"
                android:divider="@null"
                android:id="@android:id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
                </TabWidget>
        </LinearLayout>
    </android.support.v4.app.FragmentTabHost>
</RelativeLayout>

  接着，在mainActivity.java中，第一步依旧是通过findVIewById方法获取到这个控件，如下所示

   第二步，通过setup来启动这个控件，在api中已经声明不带参数的这个方法已经废弃，故在此使用有带参数的方法。

  由于我们在FragmentTabHost中放置片段，也就是碎片，相当于一个迷你型的Activity，具体知识可以参考郭神的第一行代码。所以我们的活动应该继承FragmentActivity

setup的第一个参数是上下文，第二个参数是FragmentManager，可以直接通过getSupportFragmentManager（）方法得到，第三个参数是一个id值，官方已要求我们写死了，为android.R.id.tabcontent。

  接着创建4个Fragment并将其放置在一个数组中

 接着我们要创建一个子布局，这个布局即图标按钮显示布局，一般是放置一个图片控件和一个文本控件

接着通过inflate方法把定义好的子项布局找出来

接着又是老生常谈的方法，获取图片和文本域标签

我们需要实现点击后图片颜色改变，所以我们须准备好两张图片，利用图片选择器插件生成.xml文件，具体方法可以看我上一篇文章。文字选择择颜色改变只需要在drawable下新建tab_text.xml即可

最后一步，为fragmentTabHost添加子控件，用addtab（）方法实现

贴出具体代码

public class MainActivity extends FragmentActivity {

    private Class[] fragment=new Class[]{
            MainFragment.class,AroundFragment.class,MineFragment.class,MoreFragment.class
    };
    private int[] imgSelectors=new int[]{
            R.drawable.ic_home_tab_index,
            R.drawable.ic_home_tab_near,
            R.drawable.ic_home_tab_my,
            R.drawable.ic_home_tab_more
    };
    private String[] tabTitle=new String[]{"首页","周边","我的","更多"};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        FragmentTabHost tabHost = (FragmentTabHost) findViewById(R.id.tabHost);
        tabHost.setup(MainActivity.this, getSupportFragmentManager(), android.R.id.tabcontent);

        for (int i = 0; i < fragment.length; i++) {
            View inflate= getLayoutInflater().inflate(R.layout.tab_itme,null);
            ImageView tab_iv=(ImageView)inflate.findViewById(R.id.iv);
            TextView tab_tv=(TextView)inflate.findViewById(R.id.tv);
            tab_iv.setImageResource(imgSelectors[i]);
            tab_tv.setText(tabTitle[i]);
            tabHost.addTab(tabHost.newTabSpec(""+i).setIndicator("tab1").setIndicator(inflate), fragment[i], null);
        }
    }
}

参考文章：http://blog.csdn.net/yangyu20121224/article/details/8989063