ActionBarSherLock divider style - android

Does anyone knows,
How do i set a line in between ActionBar tab bar and title bar, because i am using same color for both, that looks odd,
i am using style as:
<style name="Theme.MyTheme" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/Widget.MyTheme.ActionBar</item>
<item name="actionBarTabStyle">#style/customActionBarTabStyle</item>
</style>
here i set the color,
<style name="Widget.MyTheme.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#4B4B4B</item>
<item name="background">#4B4B4B</item>
</style>
<style name="customActionBarTabStyle" parent="Widget.Sherlock.ActionBar.TabView">
<item name="background">#4B4B4B</item>
<item name="android:background">#4B4B4B</item>
</style>

Try using something like this :
<style name="Theme.Dreams" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="android:actionBarTabBarStyle">#style/ActionBarTabBarStyle.Dreams</item>
</style>
<style name="ActionBarTabBarStyle.Dreams" parent="#style/Widget.Sherlock.ActionBar.TabBar">
<item name="android:background">#drawable/ic_tabbar_background</item>
<item name="android:showDividers">middle</item>
<item name="android:divider">#drawable/ic_tabbar_divider</item>
<item name="android:dividerPadding">0dp</item>
</style>

Related

Changing Color of Tab Text in ActionBarActivity

I have an app using the support ActionBarActivity (android.support.v7.app.ActionBarActivity), with tabs. I used the Action Bar Style Generator to change the look of the app, but now I am having a hard time getting the tab text color to change.
The style is being applied through the manifest, and shows up just fine except for the tab text color remains black no matter what I try. Here's what I have in my custom styles xml file right now:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.StyledActionBar" parent="#style/Theme.AppCompat.Light">
<item name="actionBarItemBackground">#drawable/selectable_background_StyledActionBar</item>
<item name="popupMenuStyle">#style/PopupMenu.StyledActionBar</item>
<item name="dropDownListViewStyle">#style/DropDownListView.StyledActionBar</item>
<item name="actionBarTabStyle">#style/ActionBarTabStyle.StyledActionBar</item>
<item name="actionDropDownStyle">#style/DropDownNav.StyledActionBar</item>
<item name="actionBarStyle">#style/ActionBar.Solid.StyledActionBar</item>
<item name="actionModeBackground">#drawable/cab_background_top_StyledActionBar</item>
<item name="actionModeSplitBackground">#drawable/cab_background_bottom_StyledActionBar</item>
<item name="actionModeCloseButtonStyle">#style/ActionButton.CloseMode.StyledActionBar</item>
<item name="actionBarTabTextStyle">#style/TabTextStyle</item>
<item name="android:actionBarTabTextStyle">#style/TabTextStyle</item>
</style>
<style name="TabTextStyle" parent="#style/Widget.AppCompat.ActionBar.TabText">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.Solid.StyledActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.Solid">
<item name="background">#drawable/ab_solid_StyledActionBar</item>
<item name="backgroundStacked">#drawable/ab_stacked_solid_StyledActionBar</item>
<item name="backgroundSplit">#drawable/ab_bottom_solid_StyledActionBar</item>
<item name="progressBarStyle">#style/ProgressBar.StyledActionBar</item>
</style>
<style name="ActionBar.Transparent.StyledActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="background">#drawable/ab_transparent_StyledActionBar</item>
<item name="progressBarStyle">#style/ProgressBar.StyledActionBar</item>
</style>
<style name="PopupMenu.StyledActionBar" parent="#style/Widget.AppCompat.Light.PopupMenu">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_StyledActionBar</item>
</style>
<style name="DropDownListView.StyledActionBar" parent="#style/Widget.AppCompat.Light.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_StyledActionBar</item>
</style>
<style name="ActionBarTabStyle.StyledActionBar" parent="#style/Widget.AppCompat.Light.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator_ab_StyledActionBar</item>
</style>
<style name="DropDownNav.StyledActionBar" parent="#style/Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/spinner_background_ab_StyledActionBar</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_StyledActionBar</item>
<item name="android:dropDownSelector">#drawable/selectable_background_StyledActionBar</item>
</style>
<style name="ProgressBar.StyledActionBar" parent="#style/Widget.AppCompat.ProgressBar.Horizontal">
<item name="android:progressDrawable">#drawable/progress_horizontal_StyledActionBar</item>
</style>
<style name="ActionButton.CloseMode.StyledActionBar" parent="#style/Widget.AppCompat.Light.ActionButton.CloseMode">
<item name="android:background">#drawable/btn_cab_done_StyledActionBar</item>
</style>
<!-- this style is only referenced in a Light.DarkActionBar based theme -->
<style name="Theme.StyledActionBar.Widget" parent="#style/Theme.AppCompat">
<item name="popupMenuStyle">#style/PopupMenu.StyledActionBar</item>
<item name="dropDownListViewStyle">#style/DropDownListView.StyledActionBar</item>
</style>
</resources>
As you can see, I tried to change the color to white, but to no effect. I also was trying to change the Action Bar title color, but gave up because I found a java workaround.
ActionBarActivity is deprecated.
And you are using Theme.AppCompat : ActionBarActivity is deprecated
Try to use AppCompatActivity in your java codes(Activity).

styling drop down/navigation bar actionbarsherlock font

In the application I have, I would like to have the actionbar drop down's font to be white. Till now I have the following style:
<style name="Theme.MyApplications" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/ActionBar.Solid</item>
<item name="android:textSize">18sp</item>
</style>
<style name="ActionBar.Title" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.SubTitle" parent="TextAppearance.Sherlock.Widget.ActionBar.Subtitle">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.Solid" parent="#style/Widget.Sherlock.Light.ActionBar.Solid">
<item name="titleTextStyle">#style/ActionBar.Title</item>
<item name="subtitleTextStyle">#style/ActionBar.SubTitle</item>
</style>
This style gives me a black colored font in android 3.0 and higher. Can someone please help me configure the font to be white ?
The funny thing about this is that the action overflow popup's font appears in white.
for now I just used the simple
<style name="Theme.MyApplications" parent="#style/Theme.Sherlock">
<item name="android:textSize">18sp</item>
<item name="android:textColor">#FFFFFF</item>
</style>
Its simple but it got the job done. And what got the job done was the change in the style's parent.
You have apply the style to the native ActionBar as well:
<style name="Theme.MyApplications" parent="#style/Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/ActionBar.Solid</item>
<item name="android:actionBarStyle">#style/ActionBar.Solid</item>
<item name="android:textSize">18sp</item>
</style>
<style name="ActionBar.Title" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.SubTitle" parent="TextAppearance.Sherlock.Widget.ActionBar.Subtitle">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.Solid" parent="#style/Widget.Sherlock.Light.ActionBar.Solid">
<item name="titleTextStyle">#style/ActionBar.Title</item>
<item name="subtitleTextStyle">#style/ActionBar.SubTitle</item>
<item name="android:titleTextStyle">#style/ActionBar.Title</item>
<item name="android:subtitleTextStyle">#style/ActionBar.SubTitle</item>
</style>

Styling ActionBar Sherlock

I'm trying to customize my sherlock action bar, but nothing that I code in my style.xml is recognized.
In my manifest file:
android:theme="#style/Theme.Sherlock"
My style.xml:
<resources>
<style name="Theme.MyAppTheme" parent="Theme.Sherlock">
<item name="android:actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
</style>
<style name="Theme.MyAppTheme.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#222222</item>
<item name="android:height">64dip</item>
<item name="android:titleTextStyle">#style/Theme.MyAppTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="Theme.MyAppTheme.ActionBar.TitleTextStyle" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#fff</item>
<item name="android:textStyle">bold</item>
<item name="android:textSize">32sp</item>
</style>
I'm calling my actionbar this way:
public class MainActivity extends SherlockActivity {
com.actionbarsherlock.app.ActionBar actionbar;
...
actionbar = getSupportActionBar();
... }
There is no problem in showing the actionbar, but the same does not show any customization coded in style.xml, can someone help me? Thankful.
It's because you are applying the same original style in the manifest file android:theme="#style/Theme.Sherlock" which doesn't make any difference. You have prepared the custom style with name Theme.MyAppTheme, having parent as Theme.Sherlock. So, you need to declare your customized style(Theme.MyAppTheme) in your manifest file like android:theme="#style/Theme.MyAppTheme". Even you have to include without android prefix attributes too like below as the other answerer also said. Hope this helps. Even you can refer this too.
<style name="Theme.MyAppTheme" parent="Theme.Sherlock.Light">
<item name="android:actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
<item name="actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
</style>
<style name="Theme.MyAppTheme.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#222222</item>
<item name = "background">#222222</item>
<item name="android:height">64dip</item>
<item name="height">64dip</item>
<item name="android:titleTextStyle">#style/Theme.MyAppTheme.ActionBar.TitleTextStyle</item>
<item name="titleTextStyle">#style/Theme.MyAppTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="Theme.MyAppTheme.ActionBar.TitleTextStyle" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#fff</item>
<item name="textColor">#fff</item>
<item name="android:textStyle">bold</item>
<item name="textStyle">bold</item>
<item name="android:textSize">32sp</item>
<item name="textSize">32sp</item>
</style>
Use this and you don't need to create your own style
Action Bar Style Generator
This:
<item name="android:actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
is for the default ActionBar, notice the 'android:'.
You have to style it like this:
<resources>
<style name="Theme.MyAppTheme" parent="Theme.Sherlock">
<item name="android:actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
<item name="actionBarStyle">#style/Theme.MyAppTheme.ActionBar</item>
</style>
<style name="Theme.MyAppTheme.ActionBar" parent="Widget.Sherlock.ActionBar">
<item name="android:background">#222222</item>
<item name="android:height">64dip</item>
<item name="background">#222222</item>
<item name="height">64dip</item>
<item name="android:titleTextStyle">#style/Theme.MyAppTheme.ActionBar.TitleTextStyle</item>
<item name="titleTextStyle">#style/Theme.MyAppTheme.ActionBar.TitleTextStyle</item>
</style>
<style name="Theme.MyAppTheme.ActionBar.TitleTextStyle" parent="TextAppearance.Sherlock.Widget.ActionBar.Title">
<item name="android:textColor">#fff</item>
<item name="android:textStyle">bold</item>
<item name="android:textSize">32sp</item>
<item name="textColor">#fff</item>
<item name="textStyle">bold</item>
<item name="textSize">32sp</item>
</style>

Alignment text of actionbar tab?

I try to customize actionbar tabs. Look on the picture:
My code:
<style name="ActionBarTabBar" parent="#android:style/Widget.Holo.Light.ActionBar.TabBar">
<item name="android:showDividers">end</item>
<item name="android:divider">#drawable/actionbar_tab_divider</item>
<item name="android:dividerPadding">0dp</item>
<item name="android:background">#drawable/actionbar_tab_bg</item>
<item name="android:paddingLeft">50dp</item>
<item name="android:paddingRight">0dp</item>
</style>
<style name="ActionBarTab" parent="#android:style/Widget.Holo.ActionBar.TabView">
<item name="android:showDividers">none</item>
<item name="android:measureWithLargestChild">true</item>
<item name="android:gravity">center</item>
</style>
<style name="CustomTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarStyle">#style/ActionBar</item>
<item name="android:listSelector">#style/ListView</item>
<item name="android:actionBarTabBarStyle">#style/ActionBarTab</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabBar</item>
</style>
I would like to align the text of tabs to center. When I try to set up showDividers to value middle, divider is not visible. It is visible with values beggining or end.
After more attempts, I've got desired result.
This is my code, that works properly.
<style name="ActionBarTabBar" parent="#android:style/Widget.Holo.Light.ActionBar.TabBar">
<item name="android:background">#drawable/actionbar_tab_bg</item>
<item name="android:paddingLeft">30dp</item>
<item name="android:paddingRight">30dp</item>
</style>
<style name="ActionBarTab" parent="#android:style/Widget.Holo.Light.ActionBar.TabView">
<item name="android:showDividers">middle</item>
<item name="android:divider">#drawable/actionbar_tab_divider</item>
<item name="android:dividerPadding">0dp</item>
<item name="android:measureWithLargestChild">true</item>
<item name="android:gravity">center</item>
</style>
<style name="CustomTheme" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarTabBarStyle">#style/ActionBarTab</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabBar</item>
</style>
It was needed to specify the style for Widget.Holo.Light.ActionBar.TabView and for this item set up the divider.
Delete styles you don't need to override in order to style your tabs like you described:
<style name="ActionBarTabBar" parent="#android:style/Widget.Holo.Light.ActionBar.TabBar">
<item name="android:divider">#drawable/actionbar_tab_divider</item>
<item name="android:background">#drawable/actionbar_tab_bg</item>
</style>

Action Bar Sherlock dropdown spinner divider

How can I hide dividers in action bar dropdown menu navigation?
Here is divider which I want to hide:
http://s10.postimage.org/4sjqjxltl/4nk4k.png
I tried following in styles:
<style name="MyActionBar" parent="Widget.Sherlock.Light.ActionBar">
<item name="android:background">#drawable/actionbar_bg_shape</item>
<item name="background">#drawable/actionbar_bg_shape</item>
<item name="android:showDividers">none</item>
<item name="android:divider">#00000000</item>
<item name="android:cacheColorHint">#00000000</item>
<item name="android:dividerHeight">0px</item>
</style>
<style name="MyDropDownNav" parent="Widget.Sherlock.Light.Spinner.DropDown.ActionBar">
<item name="android:textColor">#FFFFFF</item>
<item name="android:background">#drawable/actionbar_bg_shape</item>
<item name="android:popupBackground">#drawable/actionbar_dropdown_bg_shape</item>
<item name="android:dropDownSelector">#drawable/dropdown_nav_selector</item>
<item name="android:dropDownWidth">175dp</item>
<item name="android:dropDownHeight">50dp</item>
<item name="android:showDividers">none</item>
<item name="android:divider">#null</item>
<item name="android:cacheColorHint">#00000000</item>
<item name="android:dividerHeight">0px</item>
<item name="background">#drawable/actionbar_bg_shape</item>
</style>
<style name="Theme.Test.ICS" parent="Theme.Sherlock.Light">
<item name="android:actionDropDownStyle">#style/MyDropDownNav</item>
<item name="actionDropDownStyle">#style/MyDropDownNav</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="actionBarDivider">#drawable/icon</item>
<item name="android:actionBarDivider">#drawable/icon</item>
</style>
I've also tried with changing divider property to color or drawable.
But divider is still present in dropdown menu navigation, no effect at all. Any ideas would be really helpful.
You need to extend the Widget.Sherlock.ListView.DropDown style like this:
<style name="Theme.YourTheme" parent="Theme.Sherlock">
<item name="dropDownListViewStyle">#style/YourThemeDropDownListView</item>
<item name="android:dropDownListViewStyle">#style/YourThemeDropDownListView</item>
</style>
<style name="YourThemeDropDownListView" parent="Widget.Sherlock.ListView.DropDown">
<item name="android:divider">#null</item>
</style>
It's worth to note, that divider Height must be specified to edit divider's color.
<style name="YourThemeDropDownListView" parent="Widget.Sherlock.ListView.DropDown">
<item name="android:divider">#color/White</item
<item name="android:dividerHeight">5dp</item>
</style>

Categories

Resources