FragmentTabHost+Fragment实现底部菜单栏

实现顶部菜单栏的办法有很多，Tabhost已经不被推荐使用，这里实现一下啊FragmentTabHost+Fragment的实现方法
假设底部菜单栏有三个选项，所以我们要有三个Fragment，对这三个Fragment要分别实现三个Fragment继承类和三个XML文件，由于这三个都基本相同，以下只给出一个的内容
Fragment继承类实现

package com.example.text;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by 刘炳德 on 2017/10/13.
 */

public class FragmentPage1 extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragmentpage1,null);
    }
}

这里重写了Fragment的onCreateView方法，这个方法应该是用来创建界面的（说的不恰当），inflater用来动态加载布局，之后还会写一篇介绍inflater的文章 ，R.layout.fragmentpage1时对应Fragment的XML文件
XML文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="TextView1" />
</LinearLayout>

下面为主活动和主布局

主活动Mainactivity

package com.example.text;

import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTabHost;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
import android.widget.TextView;

public class MainActivity extends FragmentActivity {
    private FragmentTabHost fragmentTabHost;
    private  String text[]={"添加","历史","设置"};//标题栏三个选项对应的文字
    private int image[]={R.mipmap.add,R.mipmap.menu,R.mipmap.set};//三个选项对应的图片
    private Class fragmentArray[]={FragmentPage1.class,FragmentPage2.class,FragmentPage3.class};//三个Fragment

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        fragmentTabHost=(FragmentTabHost)findViewById(R.id.tabhost);
        fragmentTabHost.setup(this,getSupportFragmentManager(),R.id.maincontent);//将fragmentTabHost与XML文件中的FragmentTabHost联系起来
        for(int i=0;i<text.length;i++){//将每一个Fragment加入FragmentTabHost中，将每一个选项实例化
            TabHost.TabSpec spec=fragmentTabHost.newTabSpec(text[i]).setIndicator(getView(i));
            fragmentTabHost.addTab(spec,fragmentArray[i],null);
            fragmentTabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.tab_color);
        }
    }
    private View  getView(int i){//将选项卡实例化，这里的选项卡时一个自定义控件
        View view=View.inflate(MainActivity.this,R.layout.tabcontent,null);
        ImageView imageView=(ImageView)view.findViewById(R.id.mimage);
        TextView textView=(TextView)view.findViewById(R.id.mtext);
        textView.setText(text[i]);
        imageView.setImageResource(image[i]);
        return  view;
    }

}

主布局XML文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">


    <FrameLayout
        android:id="@+id/maincontent"
        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="wrap_content">
    <FrameLayout
        android:id="@+id/tabcontent"
        android:layout_width="0dp"
        android:layout_height="0dp"></FrameLayout>
    </android.support.v4.app.FragmentTabHost>
</LinearLayout>

选项卡每个选项按钮对应的自定义控件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal">
    <ImageView
        android:id="@+id/mimage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/mtext"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="2dp"
        android:textColor="@color/black"
        />
</LinearLayout>

最终效果如下

项目文件http://pan.baidu.com/s/1boABm4v