TextInputEditText 的 OutlinedBox 不起作用答案

【问题标题】：OutlinedBox for TextInputEditText is not workingTextInputEditText 的 OutlinedBox 不起作用
【发布时间】：2019-04-22 15:45:30
【问题描述】：

我正在登录屏幕上，我想用以下视图实现材料编辑文本：

以下是我的代码：

<com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox"
        android:layout_height="wrap_content">

        <com.google.android.material.textfield.TextInputEditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="This is Hint"/>

    </com.google.android.material.textfield.TextInputLayout>

但 OutlinedBox 没有出现。看起来是这样的：

请帮忙。

【问题讨论】：

使用TextInputLayout 的主题，而不是TextInputEditText 的主题。你使用了错误的风格。使用这个style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
这并不能解决 Material 1.2.x 库中的问题。相关的 GitHub 问题在这里：github.com/material-components/material-components-android/…

标签： android android-edittext material-design android-textinputlayout androidx

【解决方案1】：

使用这个

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"

取而代之的是这个

style="@style/ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox"

示例代码

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
    android:layout_height="wrap_content">

    <com.google.android.material.textfield.TextInputEditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="This is Hint"/>

</com.google.android.material.textfield.TextInputLayout>

输出

【讨论】：

这在 Material 1.2.x 库中不起作用。相关的 GitHub 问题在这里：github.com/material-components/material-components-android/…
对于 Material 1.2.x 库，请参阅答案：stackoverflow.com/a/66041459/8389762

【解决方案2】：

styles.xml 主题如下，

<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

TextInputLayout 示例：

  <com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/username"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="10dp"
            android:hint="@string/user_name" />
    </com.google.android.material.textfield.TextInputLayout>

希望这对你有用！

【讨论】：

【解决方案3】：

对于 Material 1.2.x 库，请确保您的自定义样式应该是您的应用主题的后代，否则会出错：

: IllegalArgumentException: The style on this component requires your app 
  theme to be Theme.MaterialComponents

这花了我一整天的时间才弄明白：

 <style name="AppTheme" parent="Theme.MaterialComponents.Light.Bridge">
   <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="android:statusBarColor" tools:targetApi="lollipop">@color/colorGreen</item>
    <item name="bottomSheetDialogTheme">@style/AppBottomSheetDialogTheme</item>
    <item name="textInputStyle">@style/TextInputLayoutStyle</item> //  add it here
</style>

<style name="TextInputLayoutStyle" 
  parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
    <item name="boxStrokeColor">@color/color_green</item>
    <item name="boxStrokeWidth">1dp</item>
    <item name="errorEnabled">true</item>
    <item name="hintTextColor">@color/text_color</item>
</style>

【讨论】：