I'm trying to apply a theme to a CustomEditText which inherit directly from EditText like "android:theme" attribute would do to any other classic widget.
My theme don't use a style with custom attribute, it overloads my apptheme attributes to have a different "ColorControlNormal" attribute for exemple.
Here are my theme :
Apptheme :
<style name="Theme.Light.NoActionBar" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:windowBackground">#android:color/white</item>
<item name="android:colorBackground">#android:color/white</item>
<item name="colorControlNormal">#color/pink</item>
<item name="android:textColorPrimary">#color/grey_dark</item>
<item name="colorControlActivated">#color/pink</item>
</style>
The theme I want to apply to my CustomEditText :
<style name="CustomEditTextTheme">
<item name="android:textSize">#dimen/font_medium</item>
<item name="android:ems">8</item>
<item name="colorControlNormal">#color/grey_medium</item>
<item name="colorControlActivated">#color/pink</item>
<item name="android:textColorHint">#color/grey_medium</item>
</style>
I already read this but I don't have custom style attributes and I can't apply "CustomEditTextTheme" to my whole activity.
Obviously, android:theme="#style/CustomEditText don't make the job.
Related
Is it possible to style the new com.google.android.material.textfield.TextInputEditText component without setting it for each component extra?
For example:
For the new TextInputLayout I can set the style globally in the following way:
<style name="Theme.MyTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
.
.
.
<item name="textInputStyle">#style/MyTextInputLayoutStyle</item>
</style>
I expect for the TextInputEditText a similar way for example:
<item name="editTextStyle">#style/MyTextInputEditTextStyle</item>
but it's not working.
Here is a similar post but only for the old design support components.
The TextInputLayout overrides the editTextStyle attribute using the materialThemeOverlay attribute.
For example the Widget.MaterialComponents.TextInputLayout.FilledBox has this default style:
<style name="Widget.MaterialComponents.TextInputLayout.FilledBox" parent="Base.Widget.MaterialComponents.TextInputLayout">
<item name="materialThemeOverlay">
#style/ThemeOverlay.MaterialComponents.TextInputEditText.FilledBox
</item>
....
</style>
<style name="ThemeOverlay.MaterialComponents.TextInputEditText.FilledBox">
<item name="editTextStyle">#style/Widget.MaterialComponents.TextInputEditText.FilledBox</item>
</style>
To globally define you have to define a style for the TextInputLayout extending one of the material themes.
Then you have to use the new materialThemeOverlay attribute. It allows you to override app theme attributes and you can change the editTextStyle attribute.
Something like:
<style name="MyCustomOutlined" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
<item name="materialThemeOverlay">#style/MyThemeOverlayOutlined</item>
</style>
In this way you can change the editTextStyle (app theme attribute) only for this component style.
<style name="MyThemeOverlayOutlined">
<item name="editTextStyle">#style/MyTextInputEditText_outlinedBox</item>
</style>
<style name="MyTextInputEditText_outlinedBox" parent="#style/Widget.MaterialComponents.TextInputEditText.OutlinedBox">
<item name="android:paddingTop">8dp</item>
<item name="android:paddingBottom">8dp</item>
....
</style>
Finally you can assign the MyCustomOutlined to a specific TextInputLayout in the layout:
<com.google.android.material.textfield.TextInputLayout
style="#style/MyCustomOutlined"
.../>
or assign globally in your app theme using:
<style name="AppTheme" parent="Theme.MaterialComponents.Light">
....
<item name="textInputStyle">#style/MyCustomOutlined</item>
</style>
According to this comment, editTextStyle is the correct attribute to set.
https://github.com/material-components/material-components-android/blob/6c70169e8d4ae77429a9c57785e443b2a18b4aa3/lib/java/com/google/android/material/theme/res/values/attrs.xml#L85
See example usage in these styles:
https://github.com/material-components/material-components-android/blob/6c70169e8d4ae77429a9c57785e443b2a18b4aa3/lib/java/com/google/android/material/textfield/res/values/styles.xml#L141
Updated:
Please Set #style/ThemeOverlay.MaterialComponents.TextInputEditText inside your custom TextInputLayoutStyle.
I searched google but can not find solution.I need to define different styles for Tablayout for themes.I figure it out how to include my Toolbar style but can not make it work because of Base.Widget.Design.TabLayout.When I define it as a name it works but I can only use it for one style.When I define it as parent and include it to my theme with android:tabWidgetStyle it does not work
As a parent(which does not work)
<style name="tabayout" parent="Base.Widget.Design.TabLayout">
<item name="tabSelectedTextColor">#color/white</item>
<item name="tabIndicatorColor">#color/deep_orange_300_colorAccent</item>
<item name="tabBackground">#color/deep_orange_300_colorAccent</item>
</style>
Second(which works but I can only use it once, but I need to define 14 style)
<style name="Base.Widget.Design.TabLayout" parent="android:Widget">
<item name="tabSelectedTextColor">#color/white</item>
<item name="tabIndicatorColor">#color/red_200_colorAccent</item>
<item name="tabBackground">#color/red_200_colorAccent</item>
<item name="tabTextColor">#color/red_200_colorPrimaryDark</item>
</style>
Edit
I want to style TabLayout for specific custom theme.I want to make Toolbar background textColor etc for chosen colour by user. So I used Base.Widget.Design.TabLayout as a name to style TabLayout and include it with android:tabWidgetStyle it worked.But when I use it as parent it does not work.Here My Theme
This works.But when I define Base.Widget.Design.TabLayout as a parent it does not work.
<style name="AppTheme_red_200" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/red_200_colorPrimary</item>
<item name="colorPrimaryDark">#color/red_200_colorPrimaryDark</item>
<item name="colorAccent">#color/red_200_colorAccent</item>
<item name="android:tabWidgetStyle">#style/Base.Widget.Design.TabLayout</item>
<item name="android:textColor">#color/red_400_colorPrimaryDark</item>
</style>
<style name="Base.Widget.Design.TabLayout" parent="">
<item name="tabSelectedTextColor">#color/white</item>
<item name="tabIndicatorColor">#color/red_200_colorAccent</item>
<item name="tabBackground">#color/red_200_colorAccent</item>
<item name="tabTextColor">#color/red_200_colorPrimaryDark</item>
</style>
Is it possible to specify colorPrimary and colorAccent for individual style elments rather than in theme tag
<style name="MyCustomTabLayout" parent="android:Widget">
<item name="colorPrimaryDark">#color/gray900</item>
<item name="colorAccent">#color/gray50</item>
<item name="tabBackground">?attr/colorPrimaryDark</item>
<item name="tabSelectedTextColor">?android:colorAccent</item>
</style>
<style name="MyCustomTabLayout2" parent="android:Widget">
<item name="colorPrimaryDark">#color/gray50</item>
<item name="colorAccent">#color/gray900</item>
<item name="tabBackground">?attr/colorPrimaryDark</item>
<item name="tabSelectedTextColor">?android:colorAccent</item>
</style>
When I try doing this the default theme is applied. Is there a way/better way to do this?
Widgets look up their accent colors etc on the context theme. You can define different themes to hold your styles, and apply them to different layouts using android:theme attribute, if you use the latest appcompat suport library. See https://chris.banes.me/2014/11/12/theme-vs-style/
Citing an example there:
res/values/themes.xml
<style name="RedThemeOverlay" parent="android:ThemeOverlay.Material">
<item name="android:colorEdgeEffect">#FF0000</item>
</style>
res/layout/fragment_list.xml
<ListView
...
android:theme="RedThemeOverlay" />
I am doing a personal theme to use holo widget in 2.3 android.
I did this:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="AppThemes" parent="#style/Theme.Sherlock">
<item name="android:editTextStyle">#style/EditTextAppTheme</item>
<item name="android:checkboxStyle">#style/CheckBoxAppTheme</item>
<item name="android:radioButtonStyle">#style/RadioButtonAppTheme</item>
<item name="android:buttonStyle">#style/ButtonAppTheme</item>
<item name="android:imageButtonStyle">#style/ImageButtonAppTheme</item>
<item name="android:spinnerStyle">#style/SpinnerAppTheme</item>
<item name="android:dropDownSpinnerStyle">#style/SpinnerAppTheme.DropDown</item>
<item name="android:spinnerDropDownItemStyle">#style/SpinnerDropDownItemAppTheme</item>
</style>
</resources>
the problem is that widgets don't take the correct style but take the default style. I tried to force assign the #style/EditTextAppTheme at an edittext and it worked.. so the problem is that the theme don't apply.
any idea?
update: the theme apply and work good..the solo problem is some edittext inside a dialog that show with the standard theme
To get the holo theme style in an App for API 10 and below, you can use HoloEverywhere. It's well integrated with ActionBarSherlock. ActionBarSherlock is included as a subproject. https://github.com/ChristopheVersieux/HoloEverywhere
If you want to use a customized Theme you have to set these style attributes in your Application theme. Then apply this theme to the whole App or to a single Activity by defining it in the manifest or setting it programmaticaly in the onCreate() method.
For example(for ABS):
<style name="Theme.myStyle" parent="Theme.Sherlock">
<item name="android:editTextStyle">#style/EditTextAppTheme</item>
<item name="android:checkboxStyle">#style/CheckBoxAppTheme</item>
<item name="android:radioButtonStyle">#style/RadioButtonAppTheme</item>
<item name="android:buttonStyle">#style/ButtonAppTheme</item>
<item name="android:imageButtonStyle">#style/ImageButtonAppTheme</item>
<item name="android:spinnerStyle">#style/SpinnerAppTheme</item>
<item name="android:dropDownSpinnerStyle">#style/SpinnerAppTheme.DropDown</item>
<item name="android:spinnerDropDownItemStyle">#style/SpinnerDropDownItemAppTheme</item>
</style>
And then set this theme to your Application or your Activity in the Manifest with:
android:theme="#style/Theme.myStyle"
or programmatically:
setTheme(R.style.Theme.myStyle);
I'm trying to make all EditText's in my application have a consistent look. I'm aware that I can do something like this:
<style name="App_EditTextStyle">
<item name="android:background">#drawable/filled_roundededges_box_dark</item>
<item name="android:textColor">#808080</item>
<item name="android:layout_height">45dip</item>
</style>
Then I can make a particular EditText have this style by doing this:
<EditText ...
style="#style/App_EditTextStyle
...>
But this way I have to remember to set the style individually for each and every EditText in my application which is tedious, if not error prone.
Is there some way I could make this a part of a theme or something? This is so I don't have to associate this style to every EditText. Something like this fictitious code block:
<style name="App_Theme" parent="#android:style/Theme.Holo">
...
<item name="android:EditTextSyle">#style/App_EditTextStyle</item>
...
<style>
And then in my AndroidManifest.xml I have something like:
<application
....
android:theme="#style/App_Theme">
And Voila! all my EditText's have the consistent style without me having to specify the style for each instance.
Override the attribute pointing to the EditText style(named editTextStyle :) ) in your custom theme:
<style name="App_Theme" parent="#android:style/Theme.Holo">
<item name="android:editTextStyle">#style/App_EditTextStyle</item>
</style>
and make your custom style to extend Widget.EditText:
<style name="App_EditTextStyle" parent="#android:style/Widget.EditText">
<item name="android:background">#drawable/filled_roundededges_box_dark</item>
<item name="android:textColor">#808080</item>
<item name="android:layout_height">45dip</item>
</style>
Edit:
If you're using the much newer AppCompat related themes use the editTextStyle attribute without the android prefix:
<style name="App_Theme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="editTextStyle">#style/App_EditTextStyle</item>
</style>
#Luksprog answer is correct but not working for me. After some experimentation, I found out that removing the android namespace from editTextStyle made it work for me.
<style name="App_Theme" parent="#android:style/Theme.Holo">
<item name="editTextStyle">#style/App_EditTextStyle</item>
</style>
and make your custom style to extend Widget.EditText or if using the AppCompat theme Widget.AppCompat.EditText:
<style name="App_EditTextStyle" parent="#android:style/Widget.EditText">
<item name="android:background">#drawable/filled_roundededges_box_dark</item>
<item name="android:textColor">#808080</item>
<item name="android:layout_height">45dip</item>
</style>
First, define the style for your EditText. Make sure that the parent style is android:Widget.EditText
<style name="CustomEditTextStyle" parent="android:Widget.EditText">
<item name="android:textColor">#0F0F0F</item>
<!-- ... More items here if needed ... -->
</style>
After that, override the attribute android:editTextStyle in your custom theme. Be aware, if you are using the support library, you will also need to override the attribute editTextStyle (without the android namespace).
<style name="App_Theme" parent="...">
<item name="android:editTextStyle">#style/CustomEditTextStyle</item>
<item name="editTextStyle">#style/CustomEditTextStyle</item> <!-- For compatibility with the support library -->
</style>
If you just need to set a few simple parameters, like text color, the Android namespace has a few parameters that will do that without the need to declare a separate style for the edit text. Eg
<style name="MyStyle" parent="android:Theme.Material.NoActionBar">
<item name="colorPrimary">#color/black</item>
<item name="colorPrimaryDark">#color/white</item>
<item name="colorAccent">#color/white</item>
<item name="android:textColor">#color/black</item>
<item name="android:editTextColor">#color/black</item>
<item name="android:editTextBackground">#color/black</item>
....
</style>
<style name="App_Theme" parent="#android:style/Theme.Holo">
<item name="android:editTextBackground">#drawable/filled_roundededges_box_dark</item>
</style>