Set all button style in styles.xml - android

I want to make my app to have several styles.
The style changes button style, textview color, and layout background color.
I have my button style in xml files.
And this is my code: style.xml (v21)
<style name="ThemeIndigo" parent="#android:style/Theme.Material.NoActionBar">
<item name="android:colorPrimary">#color/indigo</item>
<item name="android:colorPrimaryDark">#color/indigo</item>
<item name="android:navigationBarColor">#color/indigo_dark</item>
<item name="android:buttonStyle">#drawable/indigo_button</item>
<item name="android:background">#drawable/indigo_button</item>
</style>
This changes background color of all things on this layout.
How do I make my style to only change color of the buttons?
Please help. Thanks.
(Sorry for the bad english ;)

Try this style to change for just buttons in the app
<style name="ThemeIndigo" parent="#android:style/Theme.Material.NoActionBar">
<item name="android:buttonStyle">#style/MyButton</item>
</style>
<style name="MyButton" parent="android:Widget.Material.Button">
<item name="android:textSize">19sp</item>
<item name="android:layout_margin">0dip</item>
<item name="android:background">#ff0000</item>
</style>

Related

Change style of all TextViews in a layout

I have a layout with many TextViews and a dark background, so I want to change the text color of all the TextViews to something light.
Is there a way to do it, beyond going to each one and setting android:textColor='white'?
change font of all textviews is asking a similar question, but it's from 2014, and there is no real answer there.
I found the answer as I was typing up the question.
You want to set the appearence of the TextViews via a style resource, not manually. Then, have the style value inherit from a different one, representing the entire layout.
<TextView ...
android:textAppearance="#style/item_name"/>
<TextView ...
android:textAppearance="#style/item_details"/>
in style.xml:
<style name="LayoutStyle">
<item name="android:textColor">#C0C0C0</item>
</style>
<style name="item_name" parent="LayoutStyle">
<item name="android:textStyle">bold</item>
<item name="android:textSize">20sp</item>
</style>
<style name="item_details" parent="LayoutStyle">
<item name="android:textStyle">bold</item>
<item name="android:textSize">20sp</item>
</style>
From my experience text size and color cannot be set as a linear layout attribute.
But you can set the theme. So define the theme in styles.xml:
<style name="HeaderTitleTextViewTheme" parent="android:Widget.TextView">
<item name="android:textSize">22sp</item>
<item name="android:textColor">#color/colorSelectedItem</item>
</style>
and set it as the style of your layout:
<style name="ViewHeaderTitle">
<item name="android:theme">#style/HeaderTitleTextViewTheme</item>
<item name="android:layout_height">48sp</item>
<item name="android:paddingLeft">4dp</item>
<item name="android:paddingRight">4dp</item>
<item name="android:background">#FF5722</item>
<item name="android:gravity">center</item>
</style>
This will save you setting the style for every single TextView in the Layout

How to change to text color of all the button in my app?

How can i change the text color of all the button in my app ? right now the only think that work is to do :
<style name="MyTheme" parent="#android:style/Theme.Material.Light.NoActionBar">
<item name="android:textColor">#ff0000</item>
</style>
but i m a little worried to use android:textColor who seam to not only impact the button
I try this but it's didn't work :
<style name="BBButtonColor" parent="#android:style/Widget.Button">
<item name="android:textColor">#ff0000</item>
</style>
<style name="BBButtonStyle" parent="#android:style/Widget.Button">
<item name="android:textColor">#ff0000</item>
</style>
<style name="BBBorderlessButtonStyle" parent="#android:style/Widget.Button">
<item name="android:textColor">#ff0000</item>
</style>
<style name="MyTheme" parent="#android:style/Theme.Material.Light.NoActionBar">
<item name="android:textAppearanceButton">#style/BBButtonColor</item>
<item name="android:buttonStyle">#style/BBButtonStyle</item>
<item name="android:borderlessButtonStyle">#style/BBBorderlessButtonStyle</item>
<item name="android:colorButtonNormal">#ff0000</item>
</style>
It's mostly the color of button inside popup dialog that i want to change
Loki, you can try this. This should change the color of all buttons in your app.
<style name="BBButtonColor" parent="android:Widget.Button">
<item name="android:textColor">#FF0000</item>
</style>
You were trying to use #android:style/Widget.Button, instead use android:Widget.Button and check. Let me know if this works.
You can try this :
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:buttonStyle">#style/ButtonColor</item>
<item name="colorButtonNormal">#color/colorname</item>
</style>
<style name="ButtonColor" parent="#android:style/Widget.Button">
<item name="android:textColor">#color/colorname</item>
</style>
and/change this line in Manifest file :
android:theme="#style/AppTheme.Base
You should create new style for buttons, something like that:
<style name="optionsButton">
<item name="android:layout_width">70dp</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:background">#color/white</item>
<item name="android:textColor">#color/black</item>
<item name="android:textSize">15sp</item>
</style>
Now you can set this style for every button you want in layout xml, for example:
<Button
android:id="#+id/payCashBtn"
style="#style/optionsButton"
android:text="Cash" />
You can see I set layout_width and height in style, so all my buttons which use this style will have same parameters, but you can set different values for every button, or create multiple styles if you used it more than once. I hope it will help you.

How to create custom ToggleButton style in Android?

I am wanting to create a custom ToggleButton style, mainly so I can change the minimum height and text size depending on the screen size.
I have already done this for Button:
styles.xml
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<item name="buttonStyle">#style/MyButtonStyle</item>
</style>
<style name="MyButtonStyle" parent="Widget.AppCompat.Button">
<item name="android:minHeight">#dimen/button_min_height</item>
<item name="android:textSize">#dimen/button_text_size</item>
</style>
And I am now wanting to do a similar thing for ToggleButton. I have tried this...
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<item name="buttonStyle">#style/MyButtonStyle</item>
<item name="android:buttonStyleToggle">#style/MyToggleButtonStyle</item>
</style>
<style name="MyToggleButtonStyle" parent="Widget.AppCompat.ToggleButton">
<item name="android:minHeight">#dimen/button_min_height</item>
<item name="android:textSize">#dimen/button_text_size</item>
</style>
...but Widget.AppCompat.ToggleButton doesn't exist. So what changes do I need to make so I can control the minimum height and text size of my ToggleButtons like I already do for Buttons?
I would prefer an approach similar to the above, not only for consistency but so I don't have to go through all my layout files and update the ToggleButtons' xml individually.
This works for me.
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<item name="buttonStyle">#style/MyButtonStyle</item>
<item name="android:buttonStyleToggle">#style/MyToggleButtonStyle</item>
</style>
<style name="MyToggleButtonStyle" parent="android:Widget.Button.Toggle">
<item name="android:minHeight">#dimen/button_min_height</item>
<item name="android:textSize">#dimen/button_text_size</item>
</style>

Proper toolbar styling

I would like to avoid applying a style to the toolbars in all layouts, so I have a style I created for it:
<style name="DarkToolbar" >
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
<item name="android:background">#color/blue</item>
<item name="android:elevation">4dp</item>
</style>
And I added it to my theme as follows:
<style name="Theme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/blue</item>
<item name="colorPrimaryDark">#color/blue</item>
<item name="colorAccent">#color/blue</item>
<item name="android:toolbarStyle">#style/DarkToolbar</item>
</style>
This is the resulting toolbar:
As you can see, the title and subtitle have the wrong formatting. If I remove the style from the theme and apply it directly to the toolbar in the layout, I get the following result instead:
Both images use the same style. One is applied through the app theme with
<item name="android:toolbarStyle">#style/DarkToolbar</item>
and the second one is applied directly to the toolbar with
style="#style/DarkToolbar"
Does anyone know the reason for the difference?
Also, does anyone know why the
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
Are not being applied?
Thanks
Add parent="Widget.AppCompat.Toolbar" to your toolbar style. It is default style for toolbar.
For example:
<style name="DarkToolbar" parent="Widget.AppCompat.Toolbar">
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
<item name="android:background">#color/blue</item>
<item name="android:elevation">4dp</item>
</style>
I think this has to do with
< item name="android:theme">#style/ThemeOverlay.AppCompat.Dark.ActionBar< /item>
in your style
I personally find styling toolbar text quite complicated, so mostly end up with my own TextView. How about using your own TextView inside toolbar. It would be easy, though a bit lengthy.
You are setting parent as no action bar in your theme, as this will give you the run time exception and null point exception as there is no action bar or tool bar to set the title/sub-title. Try adding parent in your theme with toolbar or action bar likes this.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="DarkToolbar">
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
<item name="android:background">#color/blue</item>
<item name="android:elevation">4dp</item>
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/blue</item>
<item name="colorPrimaryDark">#color/blue</item>
<item name="colorAccent">#color/blue</item>
<item name="android:toolbarStyle">#style/DarkToolbar</item>
</style>
</resources>

How to change color in ActionBar when I start ActionMode

When I start ActionMode (I make this when I set items in ListView) my ToolBar change background color from dark to white and I got this:
How you can see - it's looked bad.
How I can change ToolBar background color when ActionMode is activated?
Change the ActionMode background with use of actionModeStyle attribute
<style name="AppTheme.Base" parent="Theme.AppCompat.Light">
....
....
<item name="actionModeStyle">#style/LStyled.ActionMode</item>
</style>
<style name="LStyled.ActionMode" parent="#style/Widget.AppCompat.ActionMode">
<item name="background">#color/color_action_mode_bg</item>
</style>
You need to define a color named color_action_mode_bg:
<color name="color_action_mode_bg">#009688</color>
There are other things you can change as well. e.g:
<item name="titleTextStyle">...</item>
<item name="subtitleTextStyle">...</item>
<item name="height">...</item>
To change text color of text Citroen add the following to AppTheme.Base:
<item name="actionMenuTextColor">#color/color_action_mode_text</item>
Updated Code
<style name="Widget.ActionMode">
<item name="android:background">?android:attr/actionModeBackground</item>
<item name="android:backgroundSplit">?android:attr/actionModeSplitBackground</item>
<item name="android:height">?android:attr/actionBarSize</item>
<item name="android:titleTextStyle">#android:style/TextAppearance.Widget.ActionMode.Title</item>
<item name="android:subtitleTextStyle">#android:style/TextAppearance.Widget.ActionMode.Subtitle</item>
</style>

Categories

Resources