Android首页底部导航栏实现方式
程序员文章站
2022-05-16 16:16:53
android底部导航栏的实现方式这里主要总结了3种,代码尽量追求精简,可以直接拷贝使用,便于大家比较选择。
1.bottomnavigationview实现底部导航栏
<1>首先在gr...
android底部导航栏的实现方式这里主要总结了3种,代码尽量追求精简,可以直接拷贝使用,便于大家比较选择。
1.bottomnavigationview实现底部导航栏
<1>首先在gradle文件中添加依赖,implementation'com.android.support:design:26.1.0',注意该依赖的版本不要高于compilesdkversion,否则会报错。
<2>在res目录下新建menu文件夹,创建bottom_view.xml,也就是我们底部tab的样式,代码如下:
<3>activity中引入我们的bottom_view.xml,代码如下:
<4>activity中的代码处理如下:
public class bottomnavigationviewactivity extends appcompatactivity { private button button; private menuitem lastitem; // 上一个选中的item private viewpager viewpager; @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); initview(); } public void initview(){ viewpager=findviewbyid(r.id.viewpager); final bottomnavigationview view=(bottomnavigationview)findviewbyid(r.id.bottom_navigation); //默认 >3 的选中效果会影响viewpager的滑动切换时的效果,故利用反射去掉 // bottomnavigationviewhelper.disableshiftmode(view); //拿到默认选中的item lastitem=view.getmenu().getitem(0); //点击选择item view.setonnavigationitemselectedlistener(new bottomnavigationview.onnavigationitemselectedlistener() { @override public boolean onnavigationitemselected(@nonnull menuitem item) { switch (item.getitemid()) { case r.id.item_news: viewpager.setcurrentitem(0); break; case r.id.item_lib: viewpager.setcurrentitem(1); break; case r.id.item_find: viewpager.setcurrentitem(2); break; case r.id.item_more: viewpager.setcurrentitem(3); break; } return false; } }); viewpager.addonpagechangelistener(new viewpager.onpagechangelistener() { @override public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) { } @override public void onpageselected(int position) { if (lastitem != null) { lastitem.setchecked(false); } else { view.getmenu().getitem(0).setchecked(false); } lastitem= view.getmenu().getitem(position); lastitem.setchecked(true); } @override public void onpagescrollstatechanged(int state) { } }); setupviewpager(viewpager); } private void setupviewpager(viewpager viewpager) { viewpageradapter adapter = new viewpageradapter(getsupportfragmentmanager()); adapter.addfragment(new homefragment()); adapter.addfragment(new giftfragment()); adapter.addfragment(new personfragment()); adapter.addfragment(new settingfragment()); viewpager.setadapter(adapter); } }
我们可以看一下实现的效果图:
截止到上面的代码,需要说明一下几点:
1.当menu文件夹下的bottom_view中的item数<=3时,item的展示是没有问题的,但是当item数>=4时,就会出现上图的动画效果,比较丑陋,那么如何去规避这个动画效果呢?只需要将我们上面代码中的这行代码取消注释,使其生效即可。
bottomnavigationviewhelper.disableshiftmode(view);
2.在activity_main的布局文件中,我们给高度为5dp的view文件添加了水波纹的背景,但是为什么在点击item的时候,水波纹会出现呢?虽然这是我想要的结果。
3.最终实现的效果图如下: