3

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 :

enter image description here

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):

enter image description here

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.

Abhishek Sabbarwal
  • 3,758
  • 1
  • 26
  • 41

1 Answers1

5

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

Kenny C
  • 2,279
  • 1
  • 19
  • 20
  • +1 Thanks for the input. I just added a line using View and put it above the ViewPager. I am pretty close to what I need. There is one slight difference that I see. After putting the line it appears that the tab highlighter is on top of the line. It is not smooth like the green line in above snapshot. I can clearly see the overlap visible. Is there a way to avoid this ? – Abhishek Sabbarwal Jan 18 '13 at 16:09
  • 1
    I have managed to make it smoother by reducing the layout_height for the View. Looks good now. Thanks :) – Abhishek Sabbarwal Jan 18 '13 at 16:18