Android design包自定义tablayout的底部导航栏的实现方法

概述以前做项目大多用的radiobutton,今天用tablayout来做一个tab切换页面的的效果.实现的效果就是类似QQ.微信的页面间(也就是Fragment间)的切换.如图:

以前做项目大多用的radiobutton,今天用tablayout来做一个tab切换页面的的效果.

实现的效果就是类似QQ.微信的页面间(也就是Fragment间)的切换.如图:

 

布局只要一个tablayout

<androID.support.design.Widget.TabLayout    androID:layout_wIDth="match_parent"    androID:layout_height="wrap_content"    androID:ID="@+ID/nav_tl"    app:tabIndicatorHeight="0dp"//将指示器去掉 ps:如果大家对tablayout有一些样式上的需求    可以自定义style,这里就不加了    androID:layout_gravity="bottom"    ></androID.support.design.Widget.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"?><selector xmlns:androID="http://schemas.androID.com/apk/res/androID">  <item androID:state_selected="true" androID:drawable="@mipmap/nav_home_selected"></item>  <item androID:state_selected="false" androID:drawable="@mipmap/nav_home_normal"></item></selector>`  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"?><linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:orIEntation="vertical" androID:layout_wIDth="match_parent"  androID:layout_height="match_parent">  <ImageVIEw    androID:ID="@+ID/img_tab"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_gravity="center"    />  <TextVIEw    androID:ID="@+ID/tv_tab"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_gravity="center"    androID:textcolor="@drawable/tv_color_bg"//text我用了一个颜色选择器,主要在我选中的时候能改变颜色    /></linearLayout>`   */  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,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的底部导航栏的实现方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对编程小技巧网站的支持！

总结

以上是内存溢出为你收集整理的Android design包自定义tablayout的底部导航栏的实现方法全部内容，希望文章能够帮你解决Android design包自定义tablayout的底部导航栏的实现方法所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。