Question

我将TextInputEditText小部件放置在白色背景上。片段首次加载时，小部件没有焦点。小部件周围的边框为白色（或几乎白色），因此在白色背景上不可见。这是该小部件的屏幕截图，绘制在黑色背景上以进行对比：

当我点击窗口小部件时，边框变成了我的原色，这正是我想要的。这是激活小部件后的类似屏幕截图。

我试图通过一种样式来控制这些颜色，并且已经尝试了所有可以想到的方法，但是我无法弄清楚如何调整该颜色。这是我的风格（随意尝试各种尝试）：

<style name="MyTextInputLayout" parent="Base.Widget.MaterialComponents.TextInputLayout">
    <item name="android:colorBackground">@android:color/black</item>
    <item name="android:textColorHint">@color/colorPrimary</item>
    <item name="android:paddingStart">16dp</item>
    <item name="android:paddingEnd">16dp</item>
    <item name="android:colorControlActivated">@android:color/black</item>
    <item name="android:colorControlNormal">@android:color/black</item>
    <item name="android:colorControlHighlight">@android:color/black</item>
    <item name="android:backgroundTint">@android:color/black</item>
    <item name="android:colorAccent">@android:color/black</item>
</style>

<style name="MyTextInputEditText" parent="ThemeOverlay.MaterialComponents.TextInputEditText">
    <item name="android:textColor">@android:color/black</item>
    <item name="android:colorBackground">@android:color/black</item>
    <item name="android:colorControlActivated">@android:color/black</item>
    <item name="android:colorControlNormal">@android:color/black</item>
    <item name="android:colorControlHighlight">@android:color/black</item>
    <item name="android:backgroundTint">@android:color/black</item>
    <item name="android:colorAccent">@android:color/black</item>
</style>

最后，布局的xml很有帮助：

<com.google.android.material.textfield.TextInputLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="16dp"
    android:layout_marginBottom="16dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    style="@style/MyTextInputLayout">

    <com.google.android.material.textfield.TextInputEditText
        android:id="@+id/reg_username"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/username"
        style="@style/MyTextInputEditText"/>

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

当小部件处于非活动状态（即没有焦点）时，如何更改此边框颜色？

Answer 1

我通过两个主要步骤解决了这个问题：

我遇到的第一个问题是我的TextInputLayout样式的父样式需要更改为Widget.MaterialComponents.TextInputLayout.OutlinedBox。
一旦弄清了这一点，便通过Android xml对该样式进行了跟踪，并找到了一个名为mtrl_box_stroke_color.xml的文件。这是一个选择器，在其中声明了标准TextInputLayout边框的三种颜色。该文件如下所示：

因此我复制了该文件，并在res / color文件夹中创建了自己的文件，该文件名为edit_text_box_border.xml。我根据自己的目的修改了三种颜色，最终想到了：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="?attr/colorPrimary" android:state_focused="true"/>
    <item android:alpha="0.87" android:color="@color/colorPrimary" android:state_hovered="true"/>
    <item android:alpha="0.12" android:color="@color/colorPrimary" android:state_enabled="false"/>
    <item android:alpha="0.38" android:color="@color/colorPrimary"/>
</selector>

然后，以我的风格，我不得不摆脱许多颜色尝试，并为boxStrokeColor添加了一个指向该文件的项目。这是两种样式：

<style name="MyTextInputLayout" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox">
        <item name="android:textColorHint">@color/colorPrimary</item>
        <item name="android:paddingStart">16dp</item>
        <item name="android:paddingEnd">16dp</item>
        <item name="boxStrokeColor">@color/edit_text_box_border</item>
    </style>

    <style name="MyTextInputEditText" parent="ThemeOverlay.MaterialComponents.TextInputEditText.OutlinedBox.Dense">
        <item name="android:textColor">@android:color/black</item>
    </style>

现在，当我运行该应用程序时，我将从以下内容开始：

当我点击它时会变成这个：

这就是我要的，所以问题解决了。希望这对某人有帮助。

Answer 2

1。

<com.google.android.material.textfield.TextInputLayout
 ...
 style="@style/Widget.MaterialComponents.TextInputLayout.OutlineBox"
 app:boxStrokeColor = "@android:color/holo_purple"  
 //border color when in active status
 ...

2。在colors.xml文件中添加以下内容

<color name="mtrl_textinput_default_box_stroke_color">#00ff00</color> //border color when in inactive status

Answer 3

如果您需要动态更改轮廓颜色（例如，对于自动字段验证），可以使用以下技巧：

设置

app:errorTextColor="@color/colorAccepted"
app:errorIconTint="@color/colorAccepted"

用于xml中的TextInputLayout。

然后输入代码：

text_input_layout.errorIconDrawable = null删除错误图标

和text_input_layout.error = " "启用颜色，或text_input_layout.error = null禁用颜色。

这样，TextInputLayout会占用更多空间。要解决此问题，您可以通过定义自己的样式来自定义errorTextAppearance：

<style name="ErrorTextStyle" parent="TextAppearance.MaterialComponents.Caption">
        <item name="android:textSize">0sp</item>
</style>

注意： 显然，这是hack，而不是适当的解决方案。

Answer 4

我用这个：

<style name="TextInputLayoutTheme" parent="TextAppearance.AppCompat">
    <item name="android:textColorHint">@color/secondaryTextLight</item>
    <item name="android:backgroundTint" tools:targetApi="lollipop">@color/colorAccent</item>
    <item name="android:textColor">@color/white</item>
    <item name="colorControlActivated">@color/colorAccent</item>
</style>

并在xml中：

<com.google.android.material.textfield.TextInputEditText
                style="@style/TextInputLayoutTheme"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

Answer 5

添加

        app:boxStrokeColor="@color/black"
        app:hintTextColor="@color/black"

到您的 XML 文件。我尝试了所有颜色选项。您可以用任何颜色的十六进制代码替换“@color/black”。另外写app:color，android会显示所有的颜色选项，有很多颜色字段可以改变，比如error字段，我们可以设置为红色，表示用户输入了无效数据。

材质设计TextInputEditText未激活时的边框颜色

5 个答案: