Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Disable smooth animation when clicking on tabs using ViewPagerIndicator

I'm using TabPageIndicator from ViewPagerIndicator lib with ViewPager to display 6 fragments. Suppose I'm on 1st page, if I click 6th tab I'll see all my pages scrolled. Is it possible to disable this animation? Maybe I can somehow disable it in ViewPager?

Here is code of adapter:

public class TabBarFragmentPagerAdapter extends FragmentPagerAdapter implements IconPagerAdapter {
private final List<Fragment> items;
private static final String[] TITLES = new String[] { "Home", "Profile", "Explore", "Contacts", "Beacon" };
private static final int[] ICONS = new int[] {
        R.drawable.icon_tabbar_home_bg,
        R.drawable.icon_tabbar_profile_bg,
        R.drawable.icon_tabbar_explore_bg,
        R.drawable.icon_tabbar_contacts_bg,
        R.drawable.icon_tabbar_beacon_bg
};

public TabBarFragmentPagerAdapter(FragmentManager fm, List<Fragment> items) {
    super(fm);
    this.items = items;
}

@Override
public Fragment getItem(int position) {
    return items.get(position);
}

@Override
public int getIconResId(int index) {
    return ICONS[index];
}

@Override
public CharSequence getPageTitle(int position) {
    return TITLES[position];
}

@Override
public int getCount() {
    return items.size();
}
}
like image 824
Bersh Avatar asked Apr 18 '13 08:04

Bersh


People also ask

How to disable animations for the tabs in angular?

The tabs use the Angular animations framework for its animations. By using @.disabled, you are telling the framework not to perform animations for the tabs, which is as performant as you can get.

Is it possible to disable the slide-in animation?

The slide-in animation cannot be disabled. What is the use-case or motivation for changing an existing behavior? I have a couple of tabs, which are rendered using *ngFor. The data is retrieved from ngrx/store and upon any change of state, the tabs get rerendered and slide-in again, which sucks for UX.

Is there a way to disable animations for one component only?

It was designed only with the animations in mind, and unfortunately angular doesn't provide a way to disable animations for one component without it propagating down to other ones. Sorry, something went wrong. @CodySchrank Thanks for the additional info.

What does the view pager do?

This view pager contains four tabs -and each tab loads a Fragment - and what the view pager does is to switch the tabs: for example first tab is the index, second is map, etc.


2 Answers

Another option is to override the setCurrentItem(int i) in a CustomViewPager class subclassing ViewPager like this:

@Override
public void setCurrentItem(int item) {
    super.setCurrentItem(item,false);
}
like image 82
znat Avatar answered Oct 03 '22 14:10

znat


I've investigated code of TabPageIndicator and I've found that it's impossible for now. See code of mTabClickListener:

private final OnClickListener mTabClickListener = new OnClickListener() {
    public void onClick(View view) {
        TabView tabView = (TabView)view;
        final int oldSelected = mViewPager.getCurrentItem();
        final int newSelected = tabView.getIndex();
        mViewPager.setCurrentItem(newSelected);
        if (oldSelected == newSelected && mTabReselectedListener != null) {
            mTabReselectedListener.onTabReselected(newSelected);
        }
    }
};

To support this feature we should add second parameter to setCurrentItem. Something like this:

mViewPager.setCurrentItem(newSelected, smoothScrollEnabled);
like image 20
Bersh Avatar answered Oct 03 '22 16:10

Bersh