以前做项目大多用的radiobutton,今天用tablayout来做一个tab切换页面的的效果.
实现的效果就是类似QQ.微信的页面间(也就是Fragment间)的切换.如图:
布局只要一个tablayout
然后就是activity了
public class MainActivity extends BaseActivity implements TabLayout.OnTabSelectedListener{ @BindView(R.id.main_container) LinearLayout mainContainer; @BindView(R.id.nav_tl) TabLayout navTl; //Tab 文字 private final int[] TAB_TITLES = new int[]{R.string.nav_home,R.string.nav_order,R.string.nav_my}; //Tab 图片 private final int[] TAB_IMGS = new int[]{R.drawable.nav_home_bg,R.drawable.nav_order_bg,R.drawable.nav_my_bg}; //贴出一个R.drawable.nav_home_bg的文件,其他类似:`<?xml version="1.0" encoding="utf-8"?>` private FirstPagerFragment firstPagerFragment; private PersonalFragment personalFragment; private SeekOrderFragment seekOrderFragment; private android.support.v4.app.FragmentManager manager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ButterKnife.bind(this); iniView(); iniData(); } private void iniData() { } private void iniView() { LayoutInflater inflater = LayoutInflater.from(this); manager = getSupportFragmentManager(); getTab(R.id.main_container,manager,0); setTabs(navTl,inflater,TAB_TITLES,TAB_IMGS); navTl.setOnTabSelectedListener(this); } /** * @description: 设置添加Tab * 我们自定义的布局customer_layout其实就是一张图片加文字 * `<?xml version="1.0" encoding="utf-8"?> ` */ private void setTabs(TabLayout tabLayout, LayoutInflater inflater, int[] tabTitlees, int[] tabImgs) { for (int i = 0; i < tabImgs.length; i++) { TabLayout.Tab tab = tabLayout.newTab(); View view = inflater.inflate(R.layout.customer_layout, null); tab.setCustomView(view); TextView tvTitle = (TextView) view.findViewById(R.id.tv_tab); tvTitle.setText(tabTitlees[i]); ImageView imgTab = (ImageView) view.findViewById(R.id.img_tab); imgTab.setImageResource(tabImgs[i]); tabLayout.addTab(tab); } } @Override public void onTabSelected(TabLayout.Tab tab) { getTab(R.id.main_container,manager,tab.getPosition()); } @Override public void onTabUnselected(TabLayout.Tab tab) { } @Override public void onTabReselected(TabLayout.Tab tab) { } //设置tab的监听,选中某一个tab对应的Fragment要及时切换,相信大家看代码能看明白 private void getTab(int container, android.support.v4.app.FragmentManager manager, int position){ FragmentTransaction ft = manager.beginTransaction(); hideAll(ft); switch (position){ case 0: if(firstPagerFragment==null){ firstPagerFragment=new FirstPagerFragment(); ft.add(container,firstPagerFragment); }else { ft.show(firstPagerFragment); } break; case 1: if(seekOrderFragment==null){ seekOrderFragment=new SeekOrderFragment(); ft.add(container,seekOrderFragment); }else { ft.show(seekOrderFragment); } break; case 2: if(personalFragment==null){ personalFragment=new PersonalFragment(); ft.add(container,personalFragment); }else { ft.show(personalFragment); } break; } ft.commit(); } private void hideAll(FragmentTransaction ft) { if(firstPagerFragment!=null){ ft.hide(firstPagerFragment); } if(personalFragment!=null){ ft.hide(personalFragment); } if(seekOrderFragment!=null){ ft.hide(seekOrderFragment); } } }
以上所述是小编给大家介绍的Android design包自定义tablayout的底部导航栏的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!