web-dev-qa-db-ja.com

マテリアルデザインテーマを使用するときにTextInputLayoutをカスタマイズする方法

TextInputLayoutのエラーテキストの色をカスタマイズしたい。私のアプリのテーマは、MaterialComponentsテーマの1つ、つまりTheme.MaterialComponents.Light.DarkActionBarに基づいています。 TextAppearance.Design.Errorに基づいてカスタムテキストスタイルを作成し、TextInputLayoutコンポーネントのスタイルを設定するためにWidget.Design.TextInputLayoutに基づいてカスタムスタイルを作成しました。しかし、EditTextのエラーとラベルは、作成されたスタイルでは表示されません。

これが私のコードです：

styles.xml

<style name="ErrorText" parent="TextAppearance.Design.Error">
    <item name="Android:textColor">@color/materialRed</item>
    <item name="Android:textSize">16sp</item>
</style>
<style name="TextInputLayoutAppearance" parent="Widget.Design.TextInputLayout">
    <item name="errorTextAppearance">@style/ErrorText</item>
</style>

また、TextInputLayoutのテーマを次のカスタムスタイルに設定しました。

<com.google.Android.material.textfield.TextInputLayout
    Android:id="@+id/usernameWrapper"
    app:errorTextAppearance="@style/TextInputLayoutAppearance"
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content">

    <com.google.Android.material.textfield.TextInputEditText
        Android:id="@+id/username"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content" />

</com.google.Android.material.textfield.TextInputLayout>
androidmaterial-designandroid-textinputlayoutmaterial-componentsmaterial-components-android
6
talha06

次のようなカスタムスタイルを使用するだけです。

   <com.google.Android.material.textfield.TextInputLayout
            style="@style/ErrorTextInputLayout"
            ...>

と：

  <style name="ErrorTextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="errorTextAppearance">@style/myErrorTextAppearance</item>
    <item name="errorTextColor">@color/text_input_error_selector</item>
  </style>

  <style name="myErrorTextAppearance" parent="TextAppearance.MaterialComponents.Caption" >
    <item name="Android:textSize">16sp</item>
  </style>

errorTextColorは、色またはセレクターです。

<selector xmlns:Android="http://schemas.Android.com/apk/res/Android">
  <item Android:color="?attr/colorOnError" Android:state_enabled="false"/>
  <item Android:color="?attr/colorError"/>
</selector>

使用するtextSizeに注意してください。

enter image description here

app:errorTextAppearanceおよびapp:errorTextColor属性：

<com.google.Android.material.textfield.TextInputLayout
    app:errorTextAppearance="@style/myErrorTextAppearance"
    app:errorTextColor="@color/text_input_error_selector"
    ...>
1
Gabriele Mariotti