Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android | Change theme of TextInputLayout using styles.xml

I want to apply custom style to TextInputLayout's hint and error in one theme and apply it globally i.e. define it in styles.xml and somehow apply it to all TextInputLayouts used throughout the app without having the need to add it inline like this:

<android.support.design.widget.TextInputLayout
    android:id="@+id/usernameWrapper"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/email_username"
    android:textColorHint="@color/grey_text"
    app:theme="@style/my_custom_style">

<style name="my_custom_style" parent="Widget.Design.TextInputLayout">
    <item name="android:textColorHint">@color/success_accent</item>
    <item name="android:textSize">20sp</item>
</style>

Something like we can do the Button widget like this:

styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="buttonStyle">@style/my.Widget.Button</item>
    <item name="android:buttonStyle">@style/my.Widget.Button</item>
</style>

<style name="my.Widget.Button" parent="@android:style/Widget.TextView">
    <item name="android:gravity">center</item>
    <item name="android:textSize">@dimen/some_dimen</item>
    <item name="android:textAllCaps">false</item>
</style>

NOTE: I am currently considering subclassing the TextInputLayout as a last resort, so, please keep this in mind while you answer.

Thanks :)

like image 870
MiaN KhaLiD Avatar asked Feb 09 '17 14:02

MiaN KhaLiD


People also ask

How do I set TextInputLayout style programmatically?

Method 1 - Create TextInputLayout programmatically with wrapping Context with android. view. ContextThemeWrapper and use. TextInputLayout layout = new TextInputLayout(new ContextThemeWrapper(getContext(), R.

How do I remove the default padding in TextInputLayout?

You can just set the start and end padding on the inner EditText to 0dp. Here's a screenshot with Show Layout Bounds turned on so you can see that the hints go all the way to the edge of the view.


2 Answers

Unfortunately, the TextInputLayout widget, and it seems all widgets in the Design Support Library, don't define a global theme attribute for it's default style. Therefore, it's not possible to customize it's style globally, other than by subclassing it to support a custom theme attribute to query the default style from, and using the subclass everywhere instead.

Note that the Widget.Design.TextInputLayout style would still be hardcoded as the default style on which the widget would fall back to if it can't find the attribute defined in it's theme, so this would be no different than the existing implementation by default.

It seems that there is a misconception in the Design Support Library developers that defining a default theme attribute requires it to be present in the current theme in order to work properly. This issue was reported previously for TabLayout, but was closed based on this reasoning, and subsequent queries and clarifications did not generate further response. Feel free to open another ticket on the AOSP issue tracker with the necessary clarification; hopefully it might fare better.

like image 21
corsair992 Avatar answered Oct 04 '22 01:10

corsair992


The solution I used in my project :

<style name="AppBaseTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="textInputStyle">@style/TextInputLayoutTheme</item>
  </style>
<style name="TextInputLayoutTheme" parent="Widget.Design.TextInputLayout">
    <item name="colorOnSurface">@android:color/transparent</item>
</style>
like image 122
P. Sohm Avatar answered Oct 04 '22 01:10

P. Sohm