9. Dp Notes bottom navigation bar

Combine ViewPager and QEndBar, switch ViewPager pages when clicking the icon, and change the icon state when ViewPager slides. Open QEndBar.java, define the ViewPager object viewPager, and create a new function setViewPager():

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
        }
    });
}

A ViewPager object is passed in, and a listener OnPageChangeListener is set for it, indicating that the method is outdated, but no replacement has been found, so it is temporarily used. Two methods onPageSelected, page selection, which page is selected by the parameter position, this function realizes the change of the QEndBar icon when different pages are selected:

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();
}

Set the Alpha value of the selected page to 255, the others to 0, and refresh. MainActivity.java defines the QEndBar object qeb_main, which is obtained from xml for object initialization. Not to mention, after the ViewPager object vp_main is initialized (introduced from xml, after setting the Adapter), call qeb_main.setViewPager(vp_main); (just defined method), save the run.

Note: This is a .gif animation, ctrl click on the picture to view.

Clicking the icon ViewPager does not change the page, and adds it in the onTouchEvent where the icon state is changed:

if(viewPager!=null){
    viewPager.setCurrentItem(X,false);
}

X is the number of pages, false has no ViewPager sliding animation (you can try true), in order to observe page changes, copy fragment_home.xml, three copies are fragment_list, fragment_message, fragment_user, and modify the TextView display: home page, list, message, user. Copy HomeFragment.java, three copies are ListFragment, MessageFragment, UserFragment, and modify the layout to be introduced in one-to-one correspondence, save. In FragmentPagerAdapter in MainActivity, getItem is modified:

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();

The name of ListFragment is different from other packages, don't mislead. run.

Note: This is a .gif animation, ctrl click on the picture to view.

Perseverance - 2016/10/27

9. Dp Notes bottom navigation bar

Guess you like