9、Dp Notes底部导航栏
程序员文章站
2022-03-11 11:18:40
...
将ViewPager和QEndBar结合起来,点击图标时切换ViewPager页面,ViewPager滑动时改变图标状态。打开QEndBar.java,定义ViewPager对象viewPager,新建一个函数setViewPager():
传进来一个ViewPager对象,为它设置一个监听器OnPageChangeListener,提示方法过时了,但没找到代替的,暂时用着。两个方法onPageSelected,页面选择,参数position选择的第几页,此函数中实现选择不同页面时,QEndBar图标的变化:
将选中页的Alpha值设为255,其他为0,刷新。MainActivity.java中定义QEndBar对象qeb_main,从xml中获取为对象初始化,不多说,在ViewPager对象vp_main初始化后(从xml中引入,设置Adapter后),调用qeb_main.setViewPager(vp_main);(刚定义的方法),保存运行。
注:这是一个.gif动图,ctrl点击图片查看。
点击图标ViewPager并不随更换页面,在onTouchEvent中改变图标状态的地方加入:
X为页数,false无ViewPager滑动动画(可以试试true),为了观察页面变化,复制fragment_home.xml,三份分别为fragment_list,fragment_message,fragment_user,并修改其中的TextView显示:主页,列表,消息,用户。复制HomeFragment.java,三份分别为ListFragment,MessageFragment,UserFragment,并修改其中要引入的布局一一对应,保存。MainActivity中FragmentPagerAdapter中,getItem修改:
ListFragment名字和其他包有重的,别导错。运行。
注:这是一个.gif动图,ctrl点击图片查看。
public void setViewPager(ViewPager viewPager){ if(this.viewPager!=null){ this.viewPager.setOnPageChangeListener(null); } this.viewPager=viewPager; this.viewPager.setOnPageChangeListener(new On…Listener() { @Override public void onPageSelected(int position) { // TODO Auto-generated method stub } @Override public void onPageScrolled(……) { // TODO Auto-generated method stub } @Override public void onPageScrollStateChanged(int arg0) { // TODO Auto-generated method stub } }); }
传进来一个ViewPager对象,为它设置一个监听器OnPageChangeListener,提示方法过时了,但没找到代替的,暂时用着。两个方法onPageSelected,页面选择,参数position选择的第几页,此函数中实现选择不同页面时,QEndBar图标的变化:
if(position>=0&&position<=3){ alphaItem[position]=255; if(position==0){ alphaItem[1]=0; alphaItem[2]=0; alphaItem[3]=0; } else if(position==1){ alphaItem[0]=0; alphaItem[2]=0; alphaItem[3]=0; } else if(position==2){ alphaItem[0]=0; alphaItem[1]=0; alphaItem[3]=0; } else{ alphaItem[0]=0; alphaItem[1]=0; alphaItem[2]=0; } postInvalidate(); }
将选中页的Alpha值设为255,其他为0,刷新。MainActivity.java中定义QEndBar对象qeb_main,从xml中获取为对象初始化,不多说,在ViewPager对象vp_main初始化后(从xml中引入,设置Adapter后),调用qeb_main.setViewPager(vp_main);(刚定义的方法),保存运行。
注:这是一个.gif动图,ctrl点击图片查看。
点击图标ViewPager并不随更换页面,在onTouchEvent中改变图标状态的地方加入:
if(viewPager!=null){ viewPager.setCurrentItem(X,false); }
X为页数,false无ViewPager滑动动画(可以试试true),为了观察页面变化,复制fragment_home.xml,三份分别为fragment_list,fragment_message,fragment_user,并修改其中的TextView显示:主页,列表,消息,用户。复制HomeFragment.java,三份分别为ListFragment,MessageFragment,UserFragment,并修改其中要引入的布局一一对应,保存。MainActivity中FragmentPagerAdapter中,getItem修改:
if(position==0){ return new HomeFragment(); } else if(position==1){ return new ListFragment(); } else if(position==2){ return new MessageFragment(); } else if(position==3){ return new UserFragment(); } return new HomeFragment();
ListFragment名字和其他包有重的,别导错。运行。
注:这是一个.gif动图,ctrl点击图片查看。
持之以恒——2016/10/27
推荐阅读
-
Android开发之React Navigation 导航栏样式调整+底部角标消息提示
-
Flutter沉浸式状态栏/AppBar导航栏/仿咸鱼底部凸起导航栏效果
-
android中Fragment+RadioButton实现底部导航栏
-
微信小程序实战之仿android fragment可滑动底部导航栏(4)
-
Android用Scroller实现一个可向上滑动的底部导航栏
-
基于vue-cli vue-router搭建底部导航栏移动前端项目
-
Android实现美团外卖底部导航栏动画
-
React Navigation 导航栏样式调整+底部角标消息提示
-
vue自定义底部导航栏Tabbar的实现代码
-
Android 弹出Dialog时隐藏状态栏和底部导航栏的方法