Facing Issue with Android TabLayout Tabs Click

Question

I implemented a TabLayout having three Tabs. When I Swipe the Pages Everything Work Fine, it also works when I only use tab clicks to navigate. But the problem arise when I Swipe the page and click on any of the previously selected tab, only the tab indicator changes to the new tab but the text highlight and the pages are not changing.

I Checked the click listener of the TabLayout, it is not executing in the above situation.

More Info:

minSdk:16
targetSdk:24

I tried support libraries 24.0.0 and 24.1.1

TabSelectedListener.

        tabs.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            tabPages.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {

        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {

        }
    });

PagerAdapter

public class TabPageAdapter extends FragmentStatePagerAdapter {
public TabPageAdapter(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    Fragment f1 = new Fragment1();
    Fragment f2 = new Fragment2();
    Fragment f3 = new Fragment3();

    switch (position) {
        case 0:
            return f1;
        case 1:
            return f2;
        case 2:
            return f3;
    }
    return null;
}


@Override
public int getCount() {
    return 3;
}

}

@SangramHaladkar added tabSelectedListener.

Ajay Sivan
– Ajay Sivan

2016-08-17 12:49:40 +00:00
Commented Aug 17, 2016 at 12:49 — Ajay Sivan
– Ajay Sivan, Commented Aug 17, 2016 at 12:49
Post your PagerAdapter code?

Bryan
– Bryan

2016-08-17 13:08:18 +00:00
Commented Aug 17, 2016 at 13:08 — Bryan
– Bryan, Commented Aug 17, 2016 at 13:08
@Bryan There is the Code

Ajay Sivan
– Ajay Sivan

2016-08-17 13:12:16 +00:00
Commented Aug 17, 2016 at 13:12 — Ajay Sivan
– Ajay Sivan, Commented Aug 17, 2016 at 13:12

Bryan · Accepted Answer · 2016-08-17 12:53:49Z

1

You can avoid the OnTabSelectedListener entirely, TabLayout has a convenience method for this:

tabs.setupWithViewPager(tabPages);

answered Aug 17, 2016 at 12:53

Bryan

15.2k12 gold badges76 silver badges126 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sangram Haladkar · Accepted Answer · 2016-08-17 13:20:24Z

TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
        tabLayout.addTab(tabLayout.newTab().setText("Comparison"));
        tabLayout.addTab(tabLayout.newTab().setText("Details"));
        tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);

        final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
        final PagerAdapter adapter = new PagerAdapter
                (getSupportFragmentManager(), tabLayout.getTabCount());
        viewPager.setAdapter(adapter);
        viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
        tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                viewPager.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });

insert this code in activity. add below code in activity xml file

<android.support.design.widget.TabLayout
        android:id="@+id/tab_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorM3signin"
        app:tabSelectedTextColor="@color/com_facebook_button_background_color_pressed"
        app:tabTextColor="@color/com_facebook_button_background_color_pressed"
        android:elevation="6dp"
        android:inputType="textCapCharacters"
        app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
        app:tabIndicatorColor="@color/com_facebook_button_background_color_pressed"
        app:tabIndicatorHeight="5dp"
        android:minHeight="?attr/actionBarSize"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:layout_below="@+id/toolbar" />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="fill_parent"
        android:layout_below="@id/tab_layout"/>

check this PagerAdapeter class.

public class PagerAdapter extends FragmentStatePagerAdapter {
    int mNumOfTabs;

    public PagerAdapter(FragmentManager fm, int NumOfTabs) {
        super(fm);
        this.mNumOfTabs = NumOfTabs;
    }

    @Override
    public Fragment getItem(int position) {

        switch (position) {
            case 0:
                TabFragmentOne tab1 = new TabFragmentOne();
                return tab1;
            case 1:
                TabFragmentTwo tab2 = new TabFragmentTwo();
                return tab2;

            default:
                return null;
        }
    }

    @Override
    public int getCount() {
        return mNumOfTabs;
    }
}

Collectives™ on Stack Overflow

Facing Issue with Android TabLayout Tabs Click

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related