How can I change Tabbackground and text in android viewpager?
public class MainActivity extends FragmentActivity implements
ActionBar.TabListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getActionBar();
mAdapter = new TabsPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(mAdapter);
actionBar.setHomeButtonEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Adding Tabs
for ( String tab_name : tabs) {
actionBar.addTab(actionBar.newTab().setText(tab_name)
.setTabListener(this).setCustomView(R.layout.pager_title_strip));
}
/**
* on swiping the viewpager make respective tab selected
* */
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageSelected(int position) {
// on changing the page
// make respected tab selected
actionBar.setSelectedNavigationItem(position);
}
@Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
@Override
public void onPageScrollStateChanged(int arg0) {
}
});
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// TODO Auto-generated method stub
switch (item.getItemId()) {
case R.id.share:
break;
default:
break;
}
return super.onOptionsItemSelected(item);
}
@Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
}
@Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// on tab selected
// show respected fragment view
viewPager.setCurrentItem(tab.getPosition());
}
@Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
}
below is my xml:
<RelativeLayout
android:id="@+id/content"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="@id/footer"
android:gravity="center" >
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#ffffff" >
</android.support.v4.view.ViewPager>
</RelativeLayout>
I want to set the TabPage to orange and the text should be white when it selects else it should be white, I am trying to fix it using for (String tab_name: tabs)
{
actionBar.addTab(actionBar.newTab().setText(tab_name)
.setTabListener(this).setCustomView(R.layout.pager_title_strip));
}
but i cant set the background please help how to achieve
source to share
I think you are looking for the android: backgroundStacked attribute of the ActionBar style:
<style name="MyTheme" parent="android:Theme.Holo.Light">
<item name="android:actionBarStyle">@style/MyActionBarStyle</item>
</style>
<style name="MyActionBarStyle" parent="@android:style/Widget.Holo.Light.ActionBar.Solid">
<item name="android:backgroundStacked">@drawable/my_stacked_background</item>
</style>
or (if ActionBarSherlock is used):
<style name="MyTheme" parent="@style/Theme.Sherlock.Light">
<item name="android:actionBarStyle">@style/MyActionBarStyle</item>
<item name="actionBarStyle">@style/MyActionBarStyle</item>
</style>
<style name="MyActionBarStyle" parent="@style/Widget.Sherlock.Light.ActionBar.Solid">
<item name="android:backgroundStacked">@drawable/my_stacked_background</item>
<item name="backgroundStacked">@drawable/my_stacked_background</item>
</style>
source to share
The call is under the ie function updateSelectedTab(int position)
when the activity is launched for the first time and "0" is passed in its argument so that it will display the very first tab selected by default.
Now call this function inside again onPageSelected(int position)
. updateSelected(position)
Make sure you update the tab position now before calling . Just a piece of code how you would do it:
@Override
public void onPageSelected(int position) {
// on changing the page
// make respected tab selected
actionBar.setSelectedNavigationItem(position);
updateSelected(position);
}
public void updateSelectedTab(int position){
for(int i = 1; i< getSupportActionBar().getTabCount(); i++) {
if(i == position){
ActionBar.Tab selectedTab = getSupportActionBar().getSelectedTab();
View selectedTabView = selectedTab.getCustomView();
selectedTabView.setBackgroundColor(Color.parseColor("#FF7F2A"));
TextView tv = (TextView) selectedTabView.findViewById(android.R.id.title); //for Selected Tab
tv.setTextColor(Color.parseColor("#ffffff"));
}else {
ActionBar.Tab restTab = getSupportActionBar().getTabAt(i);
View restTabView = restTab.getCustomView();
restTabView.setBackgroundColor(Color.BLACK);
TextView tv = (TextView) restTabView.findViewById(android.R.id.title); //for Selected Tab
tv.setTextColor(Color.parseColor("#ffffff"));
}
}
}
Also make sure your pager_title_strip.xml should look like this:
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical" />
Also, I haven't tested it, I think it should work anyway. Good luck :)
source to share