整体结构使用FragmentTabHost+Fragment搭建
如下图所示，整一个底部导航栏是一个FragmentTabHost，里面包含的每一个“小按钮”我们称之为TabSpec，也就是每一个分页。TabSpec里面需要有指示器Indicator，用来指示用户选中了哪一个，里面一般包含一张图片和文字描述。
核心的实现步骤以及注意点有：
1、所用的Activity必须要继承FragmentActivity，不然项目就会崩溃。
2、调用FragmentTabHost的setup()方法，设置FragmentManager，以及指定用于装载Fragment的布局容器。
3、调用FragmentTabHost的addTab()方法添加分页。
代码如下：
先将自己写的FragmentTabHost类添加到项目中，这里我们并没有使用官方提供的v4支持包中的FragmentTabHost，而是使用了我们自定义的FragmentTabHost，主要是因为官方提供的FragmentTabHost并没有进行优化，每次都会重新初始化一次Fragment。
在MainActivity中添加FragmentTabHost：布局文件代码如下：
MainActivity中的主要代码：
public class MainActivity extends BaseActivity {
private ArrayList<Tab> mTabs = new ArrayList<Tab>();//用于装载每一个分页的Tab
private LayoutInflater mInflater;
private FragmentTabHost mTabhost;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initTab();
}
private void initTab() {
Tab tab_conste = new Tab(ConsteFragment.class,R.string.conste,R.drawable.selector_icon_conste);
Tab tab_tools = new Tab(ToolsFragment.class,R.string.tools,R.drawable.selector_icon_tools);
Tab tab_calendar = new Tab(CalendarFragment.class,R.string.calendar,R.drawable.selector_icon_calendar);
Tab tab_jiemeng = new Tab(JieMengFragment.class,R.string.jiemeng,R.drawable.selector_icon_jiemeng);
mTabs.add(tab_conste);
mTabs.add(tab_calendar);
mTabs.add(tab_jiemeng);
mTabs.add(tab_tools);
mInflater = LayoutInflater.from(this);
mTabhost = (FragmentTabHost) this.findViewById(android.R.id.tabhost);
mTabhost.setup(this,getSupportFragmentManager(),R.id.realtabcontent);
//将Tab添加到TabHost
for (Tab tab : mTabs){
TabHost.TabSpec tabSpec = mTabhost.newTabSpec(getString(tab.getTitle()));
tabSpec.setIndicator(buildIndicator(tab));
mTabhost.addTab(tabSpec,tab.getFragment(),null);
}
}
private View buildIndicator(Tab tab){
View view =mInflater.inflate(R.layout.tab_indicator,null);
ImageView img = (ImageView) view.findViewById(R.id.icon_tab);
TextView text = (TextView) view.findViewById(R.id.txt_indicator);
img.setBackgroundResource(tab.getIcon());
text.setText(tab.getTitle());
return view;
}
}
页签图片的Selector文件：
这里以星座为例：
页签文字selector：
其中Tab类是每个页签类：
public class Tab {
private int title;
private int icon;
private Class fragment;
public Tab(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;
}
}
每个页签的item布局：
至此，FragmentTabHost设置完毕，每次点击不同的页签，加载不同的Fragment。
