customize action bar tabview

Question

I am trying to create a custom tabview in the action bar, something like this:

I got this view:

i want to change the background of tabviews indicators, so backgroung color become invisible and we have the green line under the selected tabview indicator.

Here are my code (i used default tabview):

public class BaseActivity extends Activity{

    ActionBar bar;

    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState); setContentView(R.layout.base_activity);

        bar = getActionBar(); 

        // Change action bar background

        BitmapDrawable background = new BitmapDrawable(BitmapFactory.decodeResource(getResources(), R.drawable.background_actionbar)); background.setTileModeX(android.graphics.Shader.TileMode.REPEAT); 

        bar.setBackgroundDrawable(background);

        bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 

        ActionBar.Tab tabA = bar.newTab().setText(getResources().getString(R.string.documents)); 

        ActionBar.Tab tabB = bar.newTab().setText(getResources().getString(R.string.videos)); 

        ActionBar.Tab tabC = bar.newTab().setText(getResources().getString(R.string.menu_settings)); 

        Fragment fragmentA = new DocumentsListFragment();

        Fragment fragmentB = new VideosListFragment();

        Fragment fragmentC = new UserAccountFragment();

        tabA.setTabListener(new MyTabsListener(fragmentA)); 

        tabB.setTabListener(new MyTabsListener(fragmentB)); 

        tabC.setTabListener(new MyTabsListener(fragmentC)); 

        bar.addTab(tabA);

        bar.addTab(tabB);

        bar.addTab(tabC);
    }


    protected class MyTabsListener implements ActionBar.TabListener
    {
        private Fragment fragment;

        public MyTabsListener(Fragment fragment) {
            this.fragment = fragment; }

        @Override

        public void onTabSelected(Tab tab, FragmentTransaction ft)
        {
            ft.replace(R.id.fragment_place, fragment, null); }

        @Override

        public void onTabReselected(Tab tab, FragmentTransaction ft) {
            // TODO Auto-generated method stub

        }

        @Override

        public void onTabUnselected(Tab tab, FragmentTransaction ft) {
            // TODO Auto-generated method stub

        }
    }

}

Please, how can i inflate those tabview indicator.

Answer 1

Add these are in styles.xml under values

 <style name="Theme.AndroidDevelopers" parent="Theme.Sherlock.Light.ForceOverflow"> 
 <item name=" android:actionBarItemBackground">@drawable/ad_selectable_background
 </item>
    <item name="android:actionBarTabStyle">@style/MyActionBarTabStyle</item>
    <item name="actionBarTabStyle">@style/MyActionBarTabStyle</item>
 </style>




<style name="MyActionBarTabStyle" parent="Widget.Sherlock.Light.ActionBar.TabBar">
    <item name="android:background">@drawable/actionbar_tab_bg</item>
   <item name="android:gravity">center</item>
   <item name="android:layout_gravity">center</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:paddingRight">10dp</item>
</style>

This is something like your Tab selector:

 <selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/ad_tab_selected_pressed_holo"           android:state_selected="true"/>
<item android:drawable="@android:color/transparent"/>