Add line below tabs in ActionBar

Question

After a lot of looking here and there I am posting this problem that I am facing on SO. Basically I have an Action bar with a tabbed layout. Below is a snapshot of how it looks now :

And here is the code chunk that sets the tabs :

public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
setTheme(R.style.Theme_example);

if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.GINGERBREAD_MR1) {
    requestWindowFeature(Window.FEATURE_NO_TITLE);
}
setContentView(R.layout.landing_page);

ViewPager viewPager = (ViewPager) findViewById(R.LandingPage.pager);

final ActionBar bar = getSupportActionBar();

bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);

mTabsAdapter = new LandingPageTabsAdapter(this, viewPager);
mTabsAdapter.addTab(bar.newTab().setText("Search"), Search.class, null);
mTabsAdapter.addTab(bar.newTab().setText("Categories"),Categories.class, null);
mTabsAdapter.addTab(bar.newTab().setText("Bookmarks"), Bookmarks.class,null);

} 

I want to add a straight line just below the tab highlighter, which is of the same color as the tab highlighter. Something like the line in Google Playstore (green line circled in red):

Currently I am styling the Actionbar using the Android Asset Studio's ActionBar Style Generator. My only reason to put the line there is to get a clean look.

Can someone suggest / advice on how I can solve this ? Thanks for stopping by and lending in your thoughts.

Answer 1

Instead of adding a line below your actionbar try adding a line above your viewpager in your layout. Also the play store isn't using tabs they are using the PageTitleStrip