FragmentTabHost实现底部导航栏和顶部滑动导航

一、实现底部导航栏效果《类似于RadioGroup》

①MainActivity的xml布局

②MainActivity的代码

import android.support.v4.app.ActivityCompat;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTabHost;
import android.support.v4.content.ContextCompat;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TabHost.TabSpec;
import android.widget.TextView;
import com.dcg.blueocean.R;


public class FileManageActivity extends FragmentActivity{

	private FragmentTabHost tabLayout;
	private LayoutInflater layoutInflater;
	//导航栏需要关联的fragment
	private Class fragmentArray[] = { NearestFragment.class, FileFragment.class, PhotoFragment.class };
	//导航栏显示的文字
	private String[] titles = { "最近", "文件", "照片" };
	//导航栏显示的小图标，可用select样式实现选中效果
	private int[] icons = { R.drawable.tab_lately, R.drawable.tab_file, R.drawable.tab_picture };
	//标题栏
	private TextView tv_title;
	

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_file_manager);
		initView();
		initTab();
	}

	private void initView() {
		tabLayout = (FragmentTabHost) findViewById(R.id.tablayout);
		layoutInflater = LayoutInflater.from(this);
		tv_title = (TextView) findViewById(R.id.tv_title);
		
	}

	private void initTab() {
		tabLayout.setup(this, getSupportFragmentManager(), R.id.container);
		for (int i = 0; i < titles.length; i++) {
			// 为每一个Tab按钮设置图标、文字和内容
			TabSpec tabSpec = tabLayout.newTabSpec(titles[i]).setIndicator(getTabItemView(i));
			// 将Tab按钮添加进Tab选项卡中
			tabLayout.addTab(tabSpec, fragmentArray[i], null);
		}
	}

	/**
	 * 给Tab按钮设置图标和文字
	 */
	private View getTabItemView(int index) {
		View view = layoutInflater.inflate(R.layout.tab_item, null);
		ImageView imageView = (ImageView) view.findViewById(R.id.tab_icon);
		imageView.setImageResource(icons[index]);
		TextView textView = (TextView) view.findViewById(R.id.tab_name);
		textView.setText(titles[index]);
		return view;
	}

}

③tab_item布局

④图片选择器的样式，这里示范其中一个

⑤展示下其中一个fragment的代码

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

public class NearestFragment extends Fragment {
	// 缓存Fragment view,防止来回切换重复加载fragment，非必须写法
	private View rootView;

	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
		if (rootView == null) {
			rootView = inflater.inflate(R.layout.fragment_nearest, container, false);
		}
		// 缓存的viewiew需要判断是否已经被加过parent，如果有parent需要从parent删除，要不然会发生这个view已经有parent的错误。
		ViewGroup parent = (ViewGroup) rootView.getParent();
		if (parent != null) {
			parent.removeView(rootView);
		}
		initView(rootView);
		return rootView;
	}

	private void initView(View view) {
		//初始化布局
	}

	//可防止fragment重叠，如果出现来回切换导航栏多个fragment重叠可如下重写该方法
	@Override
	public void setMenuVisibility(boolean menuVisible) {
		super.setMenuVisibility(menuVisible);
		if (this.getView() != null) {
			this.getView().setVisibility(menuVisible ? View.VISIBLE : View.GONE);
		}
	}

}

二、FragmentTabHost+viewpager实现顶部滑动导航

①、MainActivity的布局xml

②MainActivity的代码

public class MainActivity extends FragmentActivity implements OnTabChangeListener,OnPageChangeListener{
    private LayoutInflater myInflater;
    private FragmentTabHost tabLayout;
    private ViewPager vp;
    private FileAdapter adapter;
    private static final String[] IDS = {"frag_1", "frag_2", "frag_3", "frag_4", "frag_5"}; 
    private List ids = Arrays.asList(IDS);
    private String[] titles = {"全部", "文档", "图片", "视频", "音乐"};

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    	myInflater=inflater;
        View view = inflater.inflate(R.layout.fragment_file, container, false);
        uid=SharePreferencesOperate.getInstance().ReadStringFromPreferences(getActivity(), "uid");
        initView(view);
        return view;
    }

    private void initView(View view) {
        List list = new ArrayList(IDS.length);
        list.add(DetailFragment.newInstance(Constant.PID.concat(uid).concat(File.separator)));
        list.add(DetailFragment.newInstance(Constant.PID.concat(uid).concat(File.separator).concat("我的文件").concat(File.separator)));
        list.add(DetailFragment.newInstance(Constant.PID.concat(uid).concat(File.separator).concat("我的图片").concat(File.separator)));
        list.add(DetailFragment.newInstance(Constant.PID.concat(uid).concat(File.separator).concat("我的视频")));
        list.add(DetailFragment.newInstance(Constant.PID.concat(uid).concat(File.separator).concat("我的音乐").concat(File.separator)));
        
        tabLayout = (FragmentTabHost) view.findViewById(android.R.id.tabhost);
        tabLayout.setup(MainActivity.this, getChildFragmentManager(),android.R.id.tabcontent);  
          
        for (int i = 0; i < IDS.length; i++) {  
        	tabLayout.addTab(tabLayout.newTabSpec(IDS[i]).setIndicator(createTabView(titles[i])),Fragment.class, null);   
        }  
        tabLayout.setOnTabChangedListener(this);  
        
        vp = (ViewPager) view.findViewById(R.id.main_viewpager);
        adapter = new FileAdapter(list, getSupportFragmentManager());
        vp.setAdapter(adapter);
        vp.setOnPageChangeListener(this); 
    }

    /** 
     * 创建tab View 
     */  
    private View createTabView(String text) {  
        View tabView = myInflater.inflate(R.layout.file_tab, null);  
        TextView textView = (TextView) tabView.findViewById(R.id.tab_text);  
        textView.setText(text);  
        return tabView;  
    } 
    

	@Override
	public void onTabChanged(String tabId) {
		int position = ids.indexOf(tabId);
		vp.setCurrentItem(position);
	}

	@Override
	public void onPageScrollStateChanged(int arg0) {
		
	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		
	}

	@Override
	public void onPageSelected(int arg0) {
		tabLayout.setCurrentTab(arg0);
	}
}

③file_tab布局

④state_tabs_bg

⑤tabs_selected_bg和tabs_normal_bg

⑥tab_widget_text

⑦FileAdapter

package com.dcg.blueocean.ui.adapter;


import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**
 * Created by Gu on 2017/8/14.
 */

public class FileAdapter extends FragmentPagerAdapter {

    private List fragmentList;

    public FileAdapter(List fragmentList, FragmentManager fm) {
        super(fm);
        this.fragmentList = fragmentList;
    }

    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

    @Override
    public int getCount() {
        return fragmentList != null ? fragmentList.size() : 0;
    }

}

代码是从项目里面摘出来的，可能有些凌乱，谅解谅解。