Custom Spinner with white text color - android

I want my Action Bar spinner to display it's text in white (like in google maps app),
but i'm struggling to get there..
i'm trying something like this:
<style name="Mepo.Spinner" parent="#android:style/Widget.Spinner">
<item name="android:spinnerItemStyle">#style/StandardSpinnerItem</item>
<item name="spinnerItemStyle">#style/StandardSpinnerItem</item>
</style>
<style name="StandardSpinnerItem" parent="#android:style/Widget.TextView.SpinnerItem">
<item name="android:textAppearance">#android:color/white</item>
<item name="android:textColor">#android:color/white</item>
</style>
but that has no effect.
I know this his probably been asked but i can't find the right solution.
any ideas?
p.s i'm actually using sherlock action bar if that matters

in the end this is what i did, maybe this will help someone:
<style name="Theme.Styled" parent="Theme.Sherlock.Light.DarkActionBar">
<item name="actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="android:actionBarStyle">#style/Widget.Styled.ActionBar</item>
<item name="actionDropDownStyle">#style/xxx.ActionBar.DropDown.Style</item>
<item name="android:actionDropDownStyle">#style/xxx.ActionBar.DropDown.Style</item>
</style>
<style name="Widget.Styled.ActionBar" parent="Widget.Sherlock.Light.ActionBar.Solid.Inverse">
<item name="background">#0B2F39</item>
<item name="android:background">#0B2F39</item>
<item name="backgroundSplit">#0B2F39</item>
<item name="android:backgroundSplit">#0B2F39</item>
</style>
<style name="xxx.ActionBar.DropDown.Style" parent="Widget.Sherlock.Light.Spinner.DropDown.ActionBar">
<item name="android:background">#drawable/abs__spinner_ab_holo_dark</item>
</style>
if you have any remark or corretions i would love to hear them

If you already use an custom theme(you extended the base theme and customized it) and you want to customize the spinner only for one activity you need to do this:
<style name="Theme.MyTheme" parent="Theme.Sherlock">
... your other items
</style>
<style name="Theme.MyTheme.Spinner" parent="Theme.MyTheme">
<item name="android:spinnerItemStyle">#style/SpinnerItem</item>
<item name="android:spinnerDropDownItemStyle">#style/SpinnerItem.DropDownItem</item>
</style>
<style name="Spinner" parent="#android:style/Widget.Spinner">
<item name="android:spinnerItemStyle">#style/SpinnerItem</item>
<item name="android:spinnerDropDownItemStyle">#style/SpinnerItem.DropDownItem</item>
</style>
<style name="SpinnerItem" parent="#android:style/Widget.TextView.SpinnerItem">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="SpinnerItem.DropDownItem" parent="#android:style/Widget.Holo.Light.DropDownItem.Spinner">
<item name="android:textColor">#android:color/white</item>
</style>
And to use this style in an activity use this:
<activity
android:name=".YourActivity"
android:theme="#style/Theme.MyTheme.Spinner" >
</activity>
If you want to customize the spinner for all the activities(your application) move the items from Theme.MyTheme.Spinner into Theme.MyTheme:
<style name="Theme.MyTheme" parent="Theme.Sherlock">
... your other items
<item name="android:spinnerItemStyle">#style/SpinnerItem</item>
<item name="android:spinnerDropDownItemStyle">#style/SpinnerItem.DropDownItem</item>
</style>

Related

Styling OptionMenu on android

Here is the default Option Menu style in android. Currently I tried.
My question is : I want to override the default to style of Option Menu. Like this!
which is only first character is cap and custom typeface.
Here is my implememtation.
//style.xml
<style name="HomeTheme" parent="AppTheme.NoActionBar">
<item name="android:windowDrawsSystemBarBackgrounds">false</item>
<item name="android:fontFamily">#font/apercu</item>
<item name="actionBarStyle">#style/AppTheme.ActionBar</item>
</style>
<style name="AppTheme.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
<item name="android:actionMenuTextAppearance">#style/TextAppearance.Menu</item>
</style>
<style name="TextAppearance.Menu" parent="TextAppearance.AppCompat.Widget.ActionBar.Menu">
<item name="android:fontFamily">#font/custom_type_face</item>
<item name="android:textSize">17sp</item>
<item name="android:textColor">#4d4d4d</item>
<item name="android:textAllCaps">false</item>
</style>
I accomplished it overriding AppTheme.Widget.ActionButton. Eg.
<style name="AppTheme.Widget.ActionButton" parent="#style/Widget.AppCompat.ActionButton">
<item name="textAllCaps">false</item>
</style>
and set it to my Activity's theme like
<item name="actionButtonStyle">#style/AppTheme.Widget.ActionButton</item>

Fully Transparent Action bar on Holo Light Theme

I want to make full translucent action bar like google did, i tried several option, that seems to work on Holo, however they are not "full transparent" in Holo.Light
this is my style so far:
<style name="MyTheme.Translucent" >
<item name="windowActionBarOverlay">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="actionBarStyle">#style/MyTheme.ActionBar</item>
<item name="android:actionBarStyle">#style/MyTheme.ActionBar</item>
</style>
<style name="MyTheme.ActionBar" parent="#style/Widget.Sherlock.ActionBar">
<item name="background">#android:color/transparent</item>
<item name="android:background">#android:color/transparent</item>
</style>
and in Oncreate:
getSupportActionBar().setBackgroundDrawable(null);
the result its "almost" what i need
however i see a shade in action bar:
What i want (or something like this)
i found the solution
using
<item name="android:windowContentOverlay">#null</item>
will do the trick to remove the line
please check the link....................
http://cyrilmottier.com/2013/05/24/pushing-the-actionbar-to-the-next-level
**values/themes.xml**
<style name="Theme.TranslucentActionBar" parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/Widget.ActionBar</item>
</style>
<style name="Theme.TranslucentActionBar.ActionBar" />
<style name="Theme.TranslucentActionBar.ActionBar.Overlay">
<item name="android:actionBarStyle">#style/Widget.ActionBar.Transparent</item>
<item name="android:windowActionBarOverlay">true</item>
</style>
**values/styles.xml**
<style name="Widget.ActionBar" parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/ab_background</item>
</style>
<style name="Widget.ActionBar.Transparent">
<item name="android:background">#android:color/transparent</item>
</style>

Android: action overflow icon blue underline

I'm trying to remove the blue underline in the action bar overflow icon. Here is the screenshot:
I don't have tabs but I saw some similar answered questions about action bar tabs underline but nothing worked for me. My Base application theme is Theme.AppCompat.Light. Here are the applied styles:
<style name="AppThemeNoActionBar" parent="Theme.AppCompat.Light">
<item name="android:windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>
<item name="android:activatedBackgroundIndicator">#drawable/nav_drawer_selection</item>
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:windowActionBar">true</item>
<item name="android:windowNoTitle">false</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="android:actionMenuTextColor">#color/white</item>
<item name="android:actionOverflowButtonStyle">#style/OverFlow</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="actionMenuTextColor">#color/white</item>
<item name="actionOverflowButtonStyle">#style/OverFlow</item>
<item name="android:activatedBackgroundIndicator">#drawable/nav_drawer_selection</item>
</style>
<style name="MyActionBar"
parent="#style/Widget.AppCompat.ActionBar">
<item name="android:titleTextStyle">#style/MyActionBarTitleText</item>
<item name="android:background">#color/red</item>
<item name="titleTextStyle">#style/MyActionBarTitleText</item>
</style>
<style name="MyActionBarTitleText"
parent="#style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">#color/white</item>
</style>
<style name="OverFlow"
parent="#style/Widget.AppCompat.ActionBar">
<item name="android:src">#drawable/ic_launcher</item>
</style>
Thanks for all the help! If you need more info about the app and code let me know :)
#nejc.m i think it's due to inheritance from the "Widget" parent. Try replacing "Widget.AppCompat.ActionBar" with "Theme.AppCompat.Light.DarkActionBar". Let me know if this works.
I played around and I found out that it's a very easy solution. I added <item name="android:background">#color/red</item> to <style name="OverFlow" parent="#style/Widget.AppCompat.ActionBar">

Android TextColor

Does anyone know the way in which i am meant to code the change i want to make to the color of the ActionBar? I have tried using android:textColor , and android:color , as well as various other things. It seems like a quite a hassle for me. Although there is most probably a simple solution for this. Does anyone have any ideas?
Note: i am trying to make the font color white - from what i can tell, Android does this from the "actionbar.solid.pp" style.
<style name="Theme.Pp" parent="#android:style/Theme.Holo.Light">
<item name="android:actionBarItemBackground">#drawable/selectable_background_pp</item>
<item name="android:popupMenuStyle">#style/PopupMenu.Pp</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.Pp</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.Pp</item>
<item name="android:actionDropDownStyle">#style/DropDownNav.Pp</item>
<item name="android:actionBarStyle">#style/ActionBar.Solid.Pp</item>
<item name="android:actionModeBackground">#drawable/cab_background_top_pp</item>
<item name="android:actionModeSplitBackground">#drawable/cab_background_bottom_pp</item>
<item name="android:actionModeCloseButtonStyle">#style/ActionButton.CloseMode.Pp</item>
</style>
<style name="ActionBar.Solid.Pp" parent="#android:style/Widget.Holo.Light.ActionBar.Solid">
<item name="android:background">#111</item>
<item name="android:color">#FFF</item>
<item name="android:textStyle">bold</item>
<item name="android:progressBarStyle">#style/ProgressBar.Pp</item>
</style>
<style name="ActionBar.Transparent.Pp" parent="#android:style/Widget.Holo.Light.ActionBar">
<item name="android:background">#drawable/ab_transparent_pp</item>
<item name="android:progressBarStyle">#style/ProgressBar.Pp</item>
</style>
<style name="PopupMenu.Pp" parent="#android:style/Widget.Holo.Light.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_pp</item>
</style>
<style name="DropDownListView.Pp" parent="#android:style/Widget.Holo.Light.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_pp</item>
</style>
<style name="ActionBarTabStyle.Pp" parent="#android:style/Widget.Holo.Light.ActionBar.TabView">
<item name="android:background">#ffffff</item>
</style>
<style name="DropDownNav.Pp" parent="#android:style/Widget.Holo.Light.Spinner">
<item name="android:background">#drawable/spinner_background_ab_pp</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_pp</item>
<item name="android:dropDownSelector">#drawable/selectable_background_pp</item>
</style>
<style name="ProgressBar.Pp" parent="#android:style/Widget.Holo.Light.ProgressBar.Horizontal">
<item name="android:progressDrawable">#drawable/progress_horizontal_pp</item>
</style>
<style name="ActionButton.CloseMode.Pp" parent="#android:style/Widget.Holo.Light.ActionButton.CloseMode">
<item name="android:background">#drawable/btn_cab_done_pp</item>
</style>
<!-- this style is only referenced in a Light.DarkActionBar based theme -->
<style name="Theme.Pp.Widget" parent="#android:style/Theme.Holo">
<item name="android:popupMenuStyle">#style/PopupMenu.Pp</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.Pp</item>
</style>
Changing the action bar's text color is shown on the developer guide Styling the Action Bar
I think you can use this free tool to customize the style:
http://jgilfelt.github.io/android-actionbarstylegenerator/#name=example&compat=holo&theme=light&actionbarstyle=solid&texture=0&hairline=0&neutralPressed=1&backColor=E4E4E4%2C100&secondaryColor=D6D6D6%2C100&tabColor=33B5E5%2C100&tertiaryColor=F2F2F2%2C100&accentColor=33B5E5%2C100&cabBackColor=FFFFFF%2C100&cabHighlightColor=33B5E5%2C100

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>

Categories

Resources