After hours of trying I finally found a method to separate the actionbar tabbar from the actionbar manualy.
actionbar convert tabs to list navigation if there is no room
But now there is one problem left. The tabs don't fill the tabbar.
EDIT
The tabs are added to the actionbar by:
ActionBar.Tab relatieTab = actionBar.newTab().setText("Relaties");
actionBar.addTab(relatieTab);
Try to switch the parent. If that doesn't work try visiting this post: Stacked ActionBar tab bar not filling parent
Good luck :)
Use the following to customize the tabs in action bar:
<style name="MyAppActionBarTabStyle" parent="#android:style/Widget.ActionBar.TabView">
<item name="android:background">#drawable/actionbar_tabindicator</item>
<item name="android:minWidth">40dip</item>
<item name="android:maxWidth">40dip</item>
<item name="android:layout_width">0dip</item>
<item name="android:layout_weight">1</item>
</style>
Make sure that the activity where you are setting these navigation tabs has the following in its #android:theme
<style name="MyAppTheme" parent="android:style/Theme.Holo.Light">
<item name="android:actionBarTabStyle">#style/MyAppActionBarTabStyle</item>
</style>
I still could not figure how how to detect whether the tabbar is separate i.e. below main action bar or merged (when in landscape OR larger screens even in portrait)
Another interesting thing to know is how to prevent tab bar from collapsing to a spinner when space is not enough.
As and when I find out answers to my questions above, will update the post. Until then hope the styles help few other ppl
I just solved this problem today.
They key was using <item name="android:padding">0dp</item> like so...
<style name="MyActionBar"
parent="#android:style/Widget.Holo.Light.ActionBar">
</style>
<style name="LoginActionBar"
parent="#style/MyActionBar">
<item name="android:actionBarTabStyle">#style/LoginActionBarTabs</item>
</style>
<style name="LoginActionBarTabs"
parent="#android:style/Widget.Holo.ActionBar.TabView">
<item name="android:padding">0dp</item>
</style>
You don't need that many styles, but I didn't want to take any chunks out, which may have lead to confusion.
I also see that you already worked around this, but I figured I'd add my answer for the next person to come looking for this.
Related
I'm porting my app to appcompat21, using SlidingTabLayout for tabs in an ActionBarActivity. The Action bar is casting a shadow over the tab strip, and I can't figure out how to get rid of it:
Here's what I have:
<style name="MyActionBar" parent="#style/Widget.AppCompat.ActionBar">
<item name="background">#color/app_primary</item>
<item name="android:background">#color/app_primary</item>
<item name="backgroundSplit">#color/black</item>
<item name="android:backgroundSplit">#color/black</item>
<item name="android:elevation">0dp</item>
</style>
I've also tried
<item name="android:windowContentOverlay">#null</item>
I got the shadow under the tab bar by setting its elevation in the layout file, but now I have two shadows...
Any idea how to fix this?
For some reason, this did not work for as well:
<item name="android:elevation">0dp</item>
and:
<item name="android:windowContentOverlay">#null</item>
I am currently using, for ActionBar:
this.getSupportActionBar().setElevation(0);
When working with "Elevation", objects can be different elevations from one another, giving shadows to anything underneath them.
If you set your toolbar and the tabs layout the same elevation it will fix the issue.
Add app:elevation="0dp" on .support.design.widget.AppBarLayout. This will solve the issue.
You could also try putting
<item name="elevation">0dp</item>
without the "android:", this would spare you the pain of setting the elevation every time you start an activity
I am using actionbarsherlock in my android project. I have added tabs but the last tab going out of screen.
my problem is I don't want to be last tab out of screen. I wanted to fit all tabs in screen using actionbarsherlock.
Please help me. If any one have answer to this problem. I am stuck on it.
This is possible with the layout in your xml. Keep in mind that your text will make your tabs wider and could still cause the problem. The maximum tabs is around 5 without sliding out of your screen.
<style name="DefaultTheme" parent="#style/Theme.Sherlock.Light">
<item name="actionBarTabStyle">#style/default_ActionBarTabStyle</item>
<item name="actionBarTabBarStyle">#style/default_ActionBarTabStyle</item>
</style>
<style name="default_ActionBarTabStyle" parent="#style/Widget.Sherlock.Light.ActionBar.TabView">
<item name="android:paddingLeft">0dp</item>
<item name="android:paddingRight">0dp</item>
<item name="android:minWidth">0dp</item>
</style>
I'm using ActionBarSherlock for an Android app I'm making, and am displaying an image on one of my screens. On this screen, I want the actionbar to go away and come back as the user presses on the screen without the image being stretched. This part I have working, but to do so I created the following style and applied it to that screen. . .
<style name="DarkActionBar.ActionBarOverlay" parent="#style/Theme.Sherlock">
<item name="android:windowActionBarOverlay">true</item>
<item name="windowActionBarOverlay">true</item>
</style>
The problem is, now my action bar is transparent and I can't figure out why. If I change the parent of my style to Theme.Sherlock.Light.DarkActionBar, it is no longer transparent but doesn't look the same as Theme.Sherlock, so it will be inconsistent with the rest of my app.
I've also tried the following. . .
<style name="MyActionBar" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:background">#color/black</item>
<item name="background">#color/black</item>
</style>
<style name="DarkActionBar.ActionBarOverlay" parent="#style/Theme.Sherlock">
<item name="android:windowActionBarOverlay">true</item>
<item name="windowActionBarOverlay">true</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
</style>
Can anyone tell me why the windowActionBarOverlay items are making my actionbar transparent, and what I can do to fix it? Thank you.
As the transparent ActionBar is a feature called "Actionbar Overlay", I think the problem is inside this line:
<item name="windowActionBarOverlay">true</item>
You may need to set it to false.
Please have a read of the following paragraph:
To enable overlay mode for the action bar, you need to create a custom
theme that extends an existing action bar theme and set the
android:windowActionBarOverlay property to true
Also please have a look at Overlaying the Actionbar on Android Developers
I have two questions. Before detailing these questions, I want to add I'm using ActionBarSherlock.
The first question would be that I am having issues with adding a divider between ActionItems in my ActionBar. In the printscreen, there are 3 dividers, for instance the first one is between the back button and Check In.
I customized my ActionBar using the style below. However, the drawable called small_detail_divider does not show up. I also tried adding this divider programmatically, using the setBackgroundSplitDrawable(). That did not help either. What should I do to add divider between those ActionItems?
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="absForceOverflow">true</item>
</style>
<style name="Widget.Styled.ActionBar" parent="Widget.Sherlock.ActionBar.Solid">
<item name="background">#drawable/top_panel_background</item>
<item name="icon">#drawable/application_logo</item>
<item name="backgroundSplit">#drawable/small_detail_divider</item>
<item name="android:background">#drawable/top_panel_background</item>
<item name="android:icon">#drawable/application_logo</item>
<item name="android:backgroundSplit">#drawable/small_detail_divider</item>
</style>
Another question would be: I want to add action items in the same manner as they are added within the printscreen. When I add the action items, they are always added to the right of the ActionBar. How can I add an action item to the left of the ActionBar such as the Back Button in the printscreen? Any suggestion would help.
the attribute you are looking for is:
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarDivider">#drawable/small_detail_divider</item>
....
<item name="android:actionBarDivider">#drawable/small_detail_divider</item>
...
</style>
Just to give you some more info.
The split ActionBar should be set with:
<style name="Theme.Example" parent="Theme.Sherlock">
<item name="actionBarSplitStyle">#style/Widget.Styled.ActionBarSplit</item>
<item name="android:actionBarSplitStyle">#style/Widget.Styled.ActionBarSplit</item>
...
Then provide your custom style for the split action bar..
Thrid question: Adding in order:
When you add the menu item pragmatically use: Menu
menu.add (0, R.id.menu_new_ab_item, 0, "Item");
The order determines how you order your menu items.
You can be more specific in your menu.xml files android:orderInCategory="1..n" can be any int. I normally start at 10 or so, so I can inflate items in-front of the standard items.
In my application I'm using a mix of the actionbar tabs and the "old" TabWidget. I have no problems styling the actionbar tabs using a custom style theme.
<style name="MyTheme" parent="#android:style/Theme.Holo">
<item name="android:logo">#drawable/logo</item>
<item name="android:actionBarTabStyle">#style/MyActionBarStyle</item>
<item name="android:tabWidgetStyle">#style/MyTabStyle</item>
</style>
The TabWidgetStyle doesn't seem to have the same effect on the "old" TabWidget though. I've been trying to change the blue bottom tab-indicator color to red without any success. Does anyone have any tips on how to do this? Do I have to create an a separate tab class and use that as the tab indicator?
Thanks.