I am using viewPager with android.support.design.widget.TabLayout. My xml is
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="@+id/home_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="@dimen/custom_tab_layout_height"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<!-- tabs -->
<android.support.design.widget.TabLayout
android:id="@+id/home_tabs"
android:layout_width="match_parent"
android:layout_height="@dimen/custom_tab_layout_height"
android:layout_alignParentBottom="true"
app:tabGravity="fill"
android:background="@color/light_blue_low_opacity"
app:tabIndicatorHeight="0dp"
app:tabMode="fixed"
app:tabPaddingEnd="0dp"
app:tabPaddingStart="0dp"
app:tabSelectedTextColor="@color/light_green"
app:tabTextAppearance="@style/HomeTabsTextAppearance"
app:tabTextColor="@color/white" />
</RelativeLayout>
I set viewPager as below
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
mViewPager = (ViewPager) findViewById(R.id.home_container);
mViewPager.setAdapter(mSectionsPagerAdapter);
mViewPager.setPagingEnabled(false);
mViewPager.setOffscreenPageLimit(5);
tabLayout = (TabLayout) findViewById(R.id.home_tabs);
tabLayout.setTabTextColors(ContextCompat.getColorStateList(this, R.color.color_home_tabs));
tabLayout.setupWithViewPager(mViewPager);
My tabListener is
tabLayout.setOnTabSelectedListener(
new TabLayout.ViewPagerOnTabSelectedListener(mViewPager) {
@Override
public void onTabSelected(TabLayout.Tab tab) {
super.onTabSelected(tab);
int position = tab.getPosition();
mViewPager.setCurrentItem(position);
String tab0TextUnSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.white) + "'> " + getResources().getString(R.string.home_tab1) + " </font>";
String tab1TextUnSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.white) + "'> " + getResources().getString(R.string.home_tab2) + "</font>";
String tab2TextUnSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.white) + "'> " + getResources().getString(R.string.home_tab3) + "</font>";
String tab3TextUnSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.white) + "'> " + getResources().getString(R.string.home_tab4) + "</font>";
String tab4TextUnSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.white) + "'> " + getResources().getString(R.string.home_tab5) + "</font>";
String tab0TextSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.light_green) + "'> " + getResources().getString(R.string.home_tab1) + " </font>";
String tab1TextSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.light_green) + "'> " + getResources().getString(R.string.home_tab2) + "</font>";
String tab2TextSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.light_green) + "'> " + getResources().getString(R.string.home_tab3) + "</font>";
String tab3TextSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.light_green) + "'> " + getResources().getString(R.string.home_tab4) + "</font>";
String tab4TextSelected = "<font color='" + ContextCompat.getColor(getApplicationContext(), R.color.light_green) + "'> " + getResources().getString(R.string.home_tab5) + "</font>";
TabLayout.Tab tab0 = tabLayout.getTabAt(0);
TabLayout.Tab tab1 = tabLayout.getTabAt(1);
TabLayout.Tab tab2 = tabLayout.getTabAt(2);
TabLayout.Tab tab3 = tabLayout.getTabAt(3);
TabLayout.Tab tab4 = tabLayout.getTabAt(4);
if (tab0 != null) {
tab0.setIcon(R.drawable.ic_home_profile_unselected);
tab0.setText(Html.fromHtml(tab0TextUnSelected));
}
if (tab1 != null) {
tab1.setIcon(R.drawable.ic_home_rewards_unselected);
tab1.setText(Html.fromHtml(tab1TextUnSelected));
}
if (tab2 != null) {
tab2.setIcon(R.drawable.ic_home_gallups_unselected);
tab2.setText(Html.fromHtml(tab2TextUnSelected));
}
if (tab3 != null) {
tab3.setIcon(R.drawable.ic_home_statistics_unselected);
tab3.setText(Html.fromHtml(tab3TextUnSelected));
}
if (tab4 != null) {
tab4.setIcon(R.drawable.ic_home_settings_unselected);
tab4.setText(Html.fromHtml(tab4TextUnSelected));
}
if (position == 0) {
if (tab0 != null) {
tab0.setIcon(R.drawable.ic_home_profile_selected);
tab0.setText(Html.fromHtml(tab0TextSelected));
}
} else if (position == 1) {
if (tab1 != null) {
tab1.setIcon(R.drawable.ic_home_rewards_selected);
tab1.setText(Html.fromHtml(tab1TextSelected));
}
} else if (position == 2) {
if (tab2 != null) {
tab2.setIcon(R.drawable.ic_home_gallups_selected);
tab2.setText(Html.fromHtml(tab2TextSelected));
}
} else if (position == 3) {
if (tab3 != null) {
tab3.setIcon(R.drawable.ic_home_statistics_selected);
tab3.setText(Html.fromHtml(tab3TextSelected));
}
} else if (position == 4) {
if (tab4 != null) {
tab4.setIcon(R.drawable.ic_home_settings_selected);
tab4.setText(Html.fromHtml(tab4TextSelected));
}
}
}
});
I have override the onBackPressed method as follow
if (mViewPager.getCurrentItem() != 0) {
mViewPager.setCurrentItem(mViewPager.getCurrentItem() - 1, true);
}
To sum up, I have tabs with icons and texts. When a tab is selected then the icon is changed and the text turned in green color. When a tab is unselected then the icon is changed and the text turned in white color. This worked fine when the user clicks on tabs. When the user clicks on back button then the icon and the text color are changed correctly but for the previous tab the text remains on green color.
try this,
@Override
public void onBackPressed() {
if (viewPager.getCurrentItem() != 0) {
viewPager.setCurrentItem(viewPager.getCurrentItem() - 1,false);
}else{
finish();
}
}
but do not call super.onBackPressed() method.