android StatusBar elements color does not appear - android

I'm trying to do like this: https://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0Bx4BSt6jniD7WVQ2WXFLeUtxSlE/style_color_themes_light2.png (using that theme) (light)
I don't know why the status bar elements does not appear (or the elements have the same color as the colorPrimaryDark)
I use Theme.AppCompat.Light.NoActionBar and Theme.AppCompat.NoActionBar
With Theme.AppCompat.NoActionBar elements are white and with Theme.AppCompat.Light.NoActionBar too, I guess.
My style file:
<resources>
<style name="MyStyle" parent="MyStyle.Base">
</style>
<!-- Tema Base -->
<style name="MyStyle.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimaryDark">#color/primary_dark</item>
<item name="colorPrimary">#color/primary</item>
<item name="android:windowBackground">#color/fondo</item>
<item name="colorAccent">#color/accent</item>
</style>
</resources>
My style file for API 21+:
<resources>
<style name="MyStyle" parent="MyStyle.Base">
<item name="android:colorPrimaryDark">#color/primary_dark</item>
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorAccent">#color/accent</item>
<item name="android:textColorPrimary">#color/colorPrimario</item>
<item name="android:textColorSecondary">#color/colorSecundario</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
<item name="android:windowContentTransitions">true</item>
<item name="android:windowAllowEnterTransitionOverlap">true</item>
<item name="android:windowAllowReturnTransitionOverlap">true</item>
<item name="android:windowSharedElementEnterTransition">#android:transition/move</item>
<item name="android:windowSharedElementExitTransition">#android:transition/move</item>
</style>
</resources>

API 23+ required.
in styles.xml
<item name="android:windowLightStatusBar">#color/colorBrawn</item>

Related

Parent style for TextView style with AppCompat usage

What parent style should I use if I want to set global textViewStyle and maintain backward compatibility with AppCompat? I can't find something like Widget.AppCompat.TextView :
<style name="Base_AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:textViewStyle">#style/GlobalTextViewStyle</item>
</style>
<style name="GlobalTextViewStyle" parent="?????">
<item name="android:textAppearance">#style/TextAppearance.AppCompat.Medium</item>
</style>
You just need to extend TextAppearance.AppCompat style overriding necessary values:
<style name="Base_AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:textAppearance">#style/MyTextAppearance</item>
</style>
<style name="MyTextAppearance" parent="TextAppearance.AppCompat">
<item name="android:textColor">?android:textColorPrimary</item>
<item name="android:textColorHint">?android:textColorHint</item>
<item name="android:textColorHighlight">?android:textColorHighlight</item>
<item name="android:textColorLink">?android:textColorLink</item>
<item name="android:textSize">#dimen/abc_text_size_body_1_material</item>
<item name="textColor">?textColorPrimary</item>
<item name="textColorHighlight">?textColorHighlight</item>
<item name="textColorHint">?textColorHint</item>
<item name="textColorLink">?textColorLink</item>
<item name="textSize">16sp</item>
<item name="textStyle">normal</item>
</style>
If you want to set this style for all your TextView's in your app, you can do something like this:
<resources>
<style name="YourTheme" parent="android:YourParentThTheme">
<item name="android:textViewStyle">#style/GlobalTextViewStyle </item>
</style>
<style name="GlobalTextViewStyle" parent="android:Widget.TextView">
<item name="android:textColor">#FF000</item>
<item name="android:textStyle">bold</item>
</style>
</resources>
<style name="normal_text_white" parent="#android:style/TextAppearance.Medium">
<item name="android:textColor">#color/white_color</item>
<item name="android:textSize">#dimen/small_text_size</item>
<item name="android:textColorHint">#color/hint_color</item>
</style>
We can try this as well for AppCompat widget.
<style name="TitleStyle" parent="TextAppearance.AppCompat">
<item name="android:gravity">center_horizontal</item>
<item name="android:textColor">#android:color/black</item>
<item name="android:textSize">26sp</item>
</style>

Android action bar overflow menu remove shadow

I'd like to remove shadow around my action bar overflow menu, but i haven't found any attributes allowing that. I'm extending Theme.AppCompat.
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat">
<!-- Customize your theme here. -->
<item name="actionOverflowButtonStyle">#style/OverflowButton</item>
<item name="actionOverflowMenuStyle">#style/OverflowMenu</item>
<item name="actionBarStyle">#style/MyActionBarLogo</item>
<item name="android:dropDownListViewStyle">#style/PopupMenuListView</item>
<item name="dropDownListViewStyle">#style/PopupMenuListView</item>
<item name="android:textColor">#color/black</item>
<item name="android:popupMenuStyle">#style/PopupMenu</item>
</style>
<style name="MyActionBarLogo" parent="Widget.AppCompat.ActionBar">
<item name="background">#color/white</item>
<item name="displayOptions">useLogo|showHome</item>
<item name="elevation">0dp</item>
<item name="android:windowContentOverlay">#null</item>
</style>
<style name="OverflowButton" parent="#style/Widget.AppCompat.ActionButton.Overflow">
<item name="android:src">#mipmap/menu_logo</item>
</style>
<style name="OverflowMenu" parent="#style/Widget.AppCompat.PopupMenu.Overflow">
<item name="overlapAnchor">false</item>
<item name="android:dropDownVerticalOffset">52dp</item>
<item name="android:dropDownHorizontalOffset">10dp</item>
</style>
<style name="PopupMenuListView" parent="#style/Widget.AppCompat.ListView.DropDown">
<item name="android:divider">#drawable/menu_divider</item>
<item name="android:dividerHeight">1dp</item>
<item name="android:textColor">#color/black</item>
<item name="android:background">#color/white</item>
</style>
<style name="PopupMenu" parent="#style/Widget.AppCompat.ListPopupWindow">
<item name="android:popupBackground">#color/white</item>
</style>
http://imgur.com/5mbceT9
You can try solution this
getSupportActionBar().setElevation(0);
UPDATE
<style name="MyActionBarLogo" parent="Widget.AppCompat.ActionBar">
<item name="background">#color/white</item>
<item name="displayOptions">useLogo|showHome</item>
<item name="elevation">0dp</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:actionDropDownStyle">#style/DropDownMenuStyle</item>
</style>
<style name="DropDownMenuStyle" parent="Widget.AppCompat.Spinner.DropDown.ActionBar">
<item name="android:background">#android:color/transparent</item>
</style>
You need to apply the zero elevation style to the correct element, in this case actionOverflowMenuStyle.
(This is using appcompat)
<style name="Theme.myapp" parent="Theme.AppCompat.Light">
<item name="actionOverflowMenuStyle">#style/Theme.myapp.Widget.PopupMenu.Overflow</item>
</style>
Then
<style name="Theme.myapp.Widget.PopupMenu.Overflow" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="elevation">0dp</item>
<item name="android:popupElevation">0dp</item>
</style>

Problems WITH THEME Android 5.0+

I have a problem with my holo theme, it works right until Android 4.4 but when i run the same app in Android 5.0+ the dropdown menu for overflow items in the actionbar show the TEXT in color Black, i need the color WHITE
ANY IDEAS?
<style name="Theme.Flux" parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarItemBackground">#drawable/selectable_background_flux</item>
<item name="android:popupMenuStyle">#style/PopupMenu.Flux</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.Flux</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.Flux</item>
<item name="android:actionDropDownStyle">#style/DropDownNav.Flux</item>
<item name="android:actionBarStyle">#style/ActionBar.Solid.Flux</item>
<item name="android:actionModeBackground">#drawable/cab_background_top_flux</item>
<item name="android:actionModeSplitBackground">#drawable/cab_background_bottom_flux</item>
<item name="android:actionModeCloseButtonStyle">#style/ActionButton.CloseMode.Flux</item>
<!-- Light.DarkActionBar specific -->
<item name="android:actionBarWidgetTheme">#style/Theme.Flux.Widget</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
<item name="actionMenuTextColor">#android:color/white</item>
</style>
<style name="ActionBar.Solid.Flux" parent="#android:style/Widget.Holo.Light.ActionBar.Solid.Inverse">
<item name="android:background">#drawable/ab_solid_flux</item>
<item name="android:backgroundStacked">#drawable/ab_stacked_solid_flux</item>
<item name="android:backgroundSplit">#drawable/ab_bottom_solid_flux</item>
<item name="android:progressBarStyle">#style/ProgressBar.Flux</item>
<item name="android:textColor">#android:color/white</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
<item name="actionMenuTextColor">#android:color/white</item>
<item name="android:titleTextStyle">#style/TitleColor</item>
</style>
<style name="TitleColor" parent="android:TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:textColor">#android:color/white</item>
</style>
<style name="ActionBar.Transparent.Flux" parent="#android:style/Widget.Holo.ActionBar">
<item name="android:background">#drawable/ab_transparent_flux</item>
<item name="android:progressBarStyle">#style/ProgressBar.Flux</item>
</style>
<style name="PopupMenu.Flux" parent="#android:style/Widget.Holo.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_flux</item>
</style>
<style name="DropDownListView.Flux" parent="#android:style/Widget.Holo.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_flux</item>
</style>
<style name="ActionBarTabStyle.Flux" parent="#android:style/Widget.Holo.ActionBar.TabView">
<item name="android:background">#drawable/tab_indicator_ab_flux</item>
</style>
<style name="DropDownNav.Flux" parent="#android:style/Widget.Holo.Spinner">
<item name="android:background">#drawable/spinner_background_ab_flux</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_flux</item>
<item name="android:dropDownSelector">#drawable/selectable_background_flux</item>
</style>
<style name="ProgressBar.Flux" parent="#android:style/Widget.Holo.ProgressBar.Horizontal">
<item name="android:progressDrawable">#drawable/progress_horizontal_flux</item>
</style>
<style name="ActionButton.CloseMode.Flux" parent="#android:style/Widget.Holo.ActionButton.CloseMode">
<item name="android:background">#drawable/btn_cab_done_flux</item>
</style>
<!-- this style is only referenced in a Light.DarkActionBar based theme -->
<style name="Theme.Flux.Widget" parent="#android:style/Theme.Holo">
<item name="android:popupMenuStyle">#style/PopupMenu.Flux</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.Flux</item>
</style>
<style name="menu_labels_style">
<item name="android:background">#drawable/fab_label_background</item>
<item name="android:textColor">#android:color/white</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
</style>
Change the style file also in values-v11 and values-v14 folders
i solve my problem when i put my style file in values-v11 and values-v14 folders i also add this style to my main style.
<item name="android:itemTextAppearance">#style/TextAppearance</item>
this is my style
<style name="Theme.Flux" parent="#android:style/Theme.Holo.Light.DarkActionBar">
<item name="android:actionBarItemBackground">#drawable/selectable_background_flux</item>
<item name="android:popupMenuStyle">#style/PopupMenu.Flux</item>
<item name="android:dropDownListViewStyle">#style/DropDownListView.Flux</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle.Flux</item>
<item name="android:actionDropDownStyle">#style/DropDownNav.Flux</item>
<item name="android:actionBarStyle">#style/ActionBar.Solid.Flux</item>
<item name="android:actionModeBackground">#drawable/cab_background_top_flux</item>
<item name="android:actionModeSplitBackground">#drawable/cab_background_bottom_flux</item>
<item name="android:actionModeCloseButtonStyle">#style/ActionButton.CloseMode.Flux</item>
<!-- Light.DarkActionBar specific -->
<item name="android:actionBarWidgetTheme">#style/Theme.Flux.Widget</item>
<item name="android:itemTextAppearance">#style/TextAppearance</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
</style>
<style name="TextAppearance">
<item name="android:textColor">#android:color/white</item>
</style>

Transparent Overlay ActionBar with AppCompat?

I would like to have an ActionBar with the following properties:
Overlay bar, so that the layout's parent view will stretch to full the whole window.
A white title color for the ActionBar.
Transparent background.
I'm targeting API 14+, with AppCompat-v7:22.2.1. So I prepare my styles like this:
<style name="Theme.MyTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<item name="android:actionBarStyle">#style/Theme.MyTheme.MyActionBar</item>
<item name="actionBarStyle">#style/Theme.MyTheme.MyActionBar</item>
<item name="colorPrimary">#5af142</item>
<item name="colorPrimaryDark">#06dd09</item>
<item name="colorAccent">#20f304</item>
</style>
<style name="Theme.MyTheme.MyActionBar" parent="#style/Widget.AppCompat.ActionBar">
<item name="android:background">#android:color/transparent</item>
<item name="background">#android:color/transparent</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="windowActionBarOverlay">true</item>
<item name="android:textColor">#android:color/white</item>
</style>
And, in the Manifest, I set Theme.MyTheme as my activity's theme.
1 & 2 are working, 3 is not. It seams that I get a grey-ish background, and I don't know what should I change/add.
Try out below code, which is my styles.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!--<item name="android:windowActionBarOverlay">true</item>
<item name="windowActionBarOverlay">true</item>-->
<item name="android:windowActionBarOverlay">true</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<!-- Support library compatibility -->
<item name="windowActionBarOverlay">true</item>
<item name="actionBarStyle">#style/MyActionBar</item>
<item name="android:windowContentOverlay">#null</item>
</style>
<!-- ActionBar styles -->
<style name="MyActionBar"
parent="#style/Widget.AppCompat.Light.ActionBar.Solid.Inverse">
<item name="android:background">#color/transparent</item>
<item name="android:titleTextStyle">#style/Theme.YourTheme.Styled.ActionBar.TitleTextStyle</item>
<!-- Support library compatibility -->
<item name="background">#color/transparent</item>
<item name="titleTextStyle">#style/Theme.YourTheme.Styled.ActionBar.TitleTextStyle</item>
</style>
<style name="Theme.YourTheme.Styled.ActionBar.TitleTextStyle" parent="#android:style/Widget.TextView">
<item name="android:textSize">13sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#android:color/white</item>
<item name="textSize">13sp</item>
<item name="textStyle">bold</item>
<item name="textColor">#android:color/white</item>
</style>
</resources>

Android styles: how to change colors in styles.xml

I want to change some colors of android UI elements. But I would prefer to set a default tint color, which applies to all UI elements. I am not sure if this is possible.
If not, I want to set the "tint"-color of some UI elements, as shown below. Can anybody enlighten me?
EDIT
Based on what Entreco suggested:
My styles.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="android:textColorPrimary">#color/brown</item>
<item name="android:textColorSecondary">#color/brown</item>
<item name="android:textColorTertiary">#color/brown</item>
<item name="android:textColorPrimaryInverse">#color/brown</item>
<item name="android:textColorSecondaryInverse">#color/brown</item>
<item name="android:textColorTertiaryInverse">#color/brown</item>
<item name="colorPrimary">#color/blue</item>
<item name="colorPrimaryDark">#color/blue</item>
<item name="android:actionBarStyle">#style/MyActionBar</item>
<item name="actionBarStyle">#style/MyActionBar</item>
</style>
<!-- style for the action bar backgrounds -->
<style name="MyActionBar" parent="#style/Widget.AppCompat.Light.ActionBar">
<item name="android:titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="android:background">#color/brown</item>
<item name="titleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="subtitleTextStyle">#style/MyTheme.ActionBar.TitleTextStyle</item>
<item name="background">#color/brown</item>
</style>
<style name="MyTheme.ActionBar.TitleTextStyle" parent="#android:style/TextAppearance">
<item name="android:textColor">#color/brown_light</item>
<item name="android:textSize">24sp</item>
</style>
</resources>
And my values-v21/styles.xml:
<resources>
<style name="AppTheme" parent="AppTheme.Base">
<item name="android:colorPrimary">#color/blue</item>
<item name="android:colorPrimaryDark">#color/blue</item>
<!-- <item name="android:colorAccent">#color/white</item> -->
</style>
</resources>
And in my Manifest:
<application android:theme="#style/AppTheme.Base" >
...
</application>
But the primary color is still the same...???
Starting from Lollipop this is straight-forward thanks to the colorPrimary attribute:
file values/styles.xml:
<!-- Base application theme. -->
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primary_dark</item>
</style>
file values-v21/styles.xml:
<style name="AppTheme" parent="AppTheme.Base">
<item name="android:colorPrimary">#color/primary</item>
<item name="android:colorPrimaryDark">#color/primary_dark</item>
<item name="android:colorAccent">#color/white</item>
</style>
Basically, you can define a color pallete for your app, and I believe for your case your want to set the colorPrimary (unverified).
More info on Material colors

Categories

Resources