更改 TextInputLayout 轮廓颜色答案

【问题标题】：Change the TextInputLayout outline color更改 TextInputLayout 轮廓颜色
【发布时间】：2018-11-21 20:44:21
【问题描述】：

我正在尝试使用材质样式自定义 TextInputLayout。我设法将焦点状态设置为我想要的颜色：

使用

<com.google.android.material.textfield.TextInputLayout
     style="@style/LoginTextInputLayoutStyle"
     android:theme="@style/LoginTextInputLayoutStyle"
     android:textColorHint="#fff"
     app:boxStrokeColor="#fff"
     .....>
          <EditText ...

样式在哪里：

<style name="LoginTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="colorAccent">#fff</item>
</style>

但是当文本输入没有聚焦时，我会看到：

如何将黑线的颜色也改为白色？

【问题讨论】：

我们可以在多自动完成文本视图上添加轮廓框吗？
仅在焦点颜色上使用接受的答案，而不是在控制不集中时改变..它对你有用吗？怎么样？

标签： android material-design android-styles android-textinputlayout

【解决方案1】：

我创建了一个默认配置。

 <style name="Widget.Design.TextInputLayout" parent="AppTheme">
    <item name="hintTextAppearance">@style/AppTheme.TextFloatLabelAppearance</item>
    <item name="errorTextAppearance">@style/AppTheme.TextErrorAppearance</item>
    <item name="counterTextAppearance">@style/TextAppearance.Design.Counter</item>
    <item name="counterOverflowTextAppearance">@style/TextAppearance.Design.Counter.Overflow</item>
</style>

<style name="AppTheme.TextFloatLabelAppearance" parent="TextAppearance.Design.Hint">
    <!-- Floating label appearance here -->
    <item name="android:textColor">@color/colorAccent</item>
    <item name="android:textSize">20sp</item>
</style>

<style name="AppTheme.TextErrorAppearance" parent="TextAppearance.Design.Error">
    <!-- Error message appearance here -->
    <item name="android:textColor">#ff0000</item>
    <item name="android:textSize">20sp</item>
</style>

【讨论】：

【解决方案2】：

使用这种样式来应用边框颜色和边框宽度，如下所示：

<style name="LoginTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="boxStrokeColor">#fff</item>
    <item name="boxStrokeWidth">2dp</item>
</style>

从此link获取有关样式的更多详细信息

在colors.xml 文件中添加以下行，覆盖TextInputLayout 的默认颜色

<color name="mtrl_textinput_default_box_stroke_color" tools:override="true">#fff</color>

【讨论】：

这会改变焦点模式下的轮廓，但当编辑文本没有焦点时仍然有黑色轮廓 =(
@Addev 检查我编辑的答案并在您的 colors.xml 文件中添加颜色。
@RutvikBhatt 谢谢。但 android studio 表示该资源是私有的，可能会在没有通知的情况下消失。有没有更好的解决方案？
@RutvikBhatt 非聚焦模式下的提示文本颜色怎么样？？
@RutvikBhatt 如果我更改了颜色的默认颜色，那么它将更改所有活动中的轮廓框颜色，但我希望为不同的活动使用不同颜色的笔划，那么该怎么办？

【解决方案3】：

从 Android 的 Material Components 1.1.0-alpha02 版本开始，它可以为这些项目简单地创建一个 ColorStateList。程序如下：

在 res 中创建一个新的资源目录“color”，在 color 里面添加一个名为“text_input_box_stroke.xml”的颜色资源文件res/color/text_input_box_stroke.xml 输入如下内容：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="#fcc" android:state_focused="true"/>
    <item android:color="#cfc" android:state_hovered="true"/>
    <item android:color="#ccf"/>
</selector>

然后在您的styles.xml 中输入：

<style name="LoginTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="boxStrokeColor">@color/text_input_box_stroke</item>
</style>

最后为实际TextInputLayout指明你的风格：

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/my_layout_id"
    style="@style/LoginTextInputLayoutStyle"
    ...

【讨论】：

这实际上对我使用 com.google.android.material:material:1.0.0 有效。但我使用Widget.MaterialComponents.TextInputLayout.OutlinedBox 作为基本样式（不是 Dense）
@VadimKotov 它对我不起作用，使用相同的配置
如何更改 InputBox 的边框，因为它在焦点状态下更粗
完美工作，我在样式中添加了一些其他项目，也可以更改提示颜色等
这必须是预期的方法，而不是覆盖可能停止现有的内部颜色的所有建议

【解决方案4】：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:color="#FFFFFF"/>

<item android:state_focused="false" android:color="#FFFFFF"/></selector>

创建颜色目录并在其中创建资源文件将上述代码粘贴到颜色目录xml文件中并在文本输入布局样式中粘贴以下行

<item name="boxStrokeColor">@color/focus_tint_list</item>

【讨论】：

【解决方案5】：

从 Material Components Alpha 7 开始，您只需创建一个颜色选择器文件，如下所示：颜色/text_input_outline_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="true" android:color="@color/buttonDark"/>
    <item android:state_hovered="true" android:color="@color/buttonDark"/>
    <item android:state_focused="true" android:color="@color/buttonDark"/>
    <item android:color="@color/buttonDark"/>
</selector>

有关如何设置的更多上下文。以下是相关源代码：

ColorStateList boxStrokeColorStateList =
    MaterialResources.getColorStateList(context, a, R.styleable.TextInputLayout_boxStrokeColor);
if (boxStrokeColorStateList != null && boxStrokeColorStateList.isStateful()) {
  defaultStrokeColor = boxStrokeColorStateList.getDefaultColor();
  disabledColor =
      boxStrokeColorStateList.getColorForState(new int[] {-android.R.attr.state_enabled}, -1);
  hoveredStrokeColor =
      boxStrokeColorStateList.getColorForState(new int[] {android.R.attr.state_hovered}, -1);
  focusedStrokeColor =
      boxStrokeColorStateList.getColorForState(new int[] {android.R.attr.state_focused}, -1);
} else {
  // If attribute boxStrokeColor is not a color state list but only a single value, its value
  // will be applied to the box's focus state.
  focusedStrokeColor =
      a.getColor(R.styleable.TextInputLayout_boxStrokeColor, Color.TRANSPARENT);
  defaultStrokeColor =
      ContextCompat.getColor(context, R.color.mtrl_textinput_default_box_stroke_color);
  disabledColor = ContextCompat.getColor(context, R.color.mtrl_textinput_disabled_color);
  hoveredStrokeColor =
      ContextCompat.getColor(context, R.color.mtrl_textinput_hovered_box_stroke_color);
}

从此列表中，您可以看到您希望确保使用定义了所有状态的颜色选择器，否则它将默认返回另一种颜色。

【讨论】：

此解决方案存在问题。此选择器不会更改默认颜色。经测试。必须覆盖 mtrl_textinput_default_box_stroke_color。 github.com/material-components/material-components-android/…

【解决方案6】：

创建主题并覆盖“colorOnSurface”属性。

<style name="AppTheme.LoginScreenTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <item name="colorOnSurface">#FFF</item>
</style>

将主题应用于您的登录活动。

<activity
    android:name=".login.ui.login.LoginActivity"
    android:label="@string/title_activity_login"
    android:launchMode="singleInstance"
    android:screenOrientation="portrait"
    android:theme="@style/AppTheme.LoginScreenTheme"
    android:windowSoftInputMode="adjustResize|stateHidden"/>

【讨论】：

【解决方案7】：

我正在动态创建我的屏幕。我正在使用TextInputLayout 并在TextInputLayout 中创建我的动态编辑文本。如果要将TextInputLayout赋予边框，请按顺序执行以下步骤。

1- 包括 Build.gradle；

implementation 'com.google.android.material:material:1.0.0'

2- 在 Kotlin 代码中；

val textInputLayout = TextInputLayout(this)
        textInputLayout.apply {
            boxStrokeColor = Color.parseColor("#E68A06")
            setBoxBackgroundMode(TextInputLayout.BOX_BACKGROUND_OUTLINE)
            setHintTextAppearance(R.style.ValidatableInputLayoutStyle_OutlineBox_HintInputLayoutStyle)
            setBoxCornerRadii(16f, 16f, 16f, 16f)
            setPadding(4, 0, 0, 0)
        }

3-style.xml

<style name="ValidatableInputLayoutStyle.OutlineBox.HintInputLayoutStyle" parent="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
        <item name="android:textColor">@color/colorPrimary</item>
        <item name="android:textSize">14sp</item>

My Component image link

【讨论】：

【解决方案8】：

第 1 步。使用1.2.0-alpha05 或更高版本

implementation 'com.google.android.material:material:1.2.0-alpha05'

第 2 步 - 重要！。确保您的应用主题是或是Theme.MaterialComponents 的后代。见here

设置完成后，所有属性设置都会按预期工作。

第 3 步。 使用 specification 中的属性设置

<com.google.android.material.textfield.TextInputLayout
    android:id="@+id/filledTextField"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/label_text"
    app:helperTextEnabled="true"
    app:helperText="@string/helper_text"
    app:counterEnabled="true"
    app:counterMaxLength="20"
    app:startIconContentDescription="@string/leading_icon_content_desc"
    app:startIconDrawable="@drawable/baseline_favorite_24">

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

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

【讨论】：

第二步真的很重要，谢谢..！

【解决方案9】：

        <com.google.android.material.textfield.TextInputLayout
        style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Password"
        app:boxStrokeColor="#fff"
        android:textColorHint="#fff"
        app:passwordToggleEnabled="true">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/password"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            ***app:boxStrokeColor="#fff"***
            android:inputType="textPassword"
            android:textColor="#fff"
            />
    </com.google.android.material.textfield.TextInputLayout>

【讨论】：

【解决方案10】：

材料编辑文本

第一步：在 build.gradle(Module App) 模块依赖部分添加库

实现'com.android.support:design:28.0.0-alpha1'

第 2 步：xml 代码

<com.google.android.material.textfield.TextInputLayout
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:boxStrokeColor="#0000FF"
            app:boxStrokeWidth="2dp"
            android:layout_gravity="center"
            >

           <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/txtusername"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="@string/lable" />

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

【讨论】：

【解决方案11】：

首先从您的 TextInputLayout 中删除

<item name="boxStrokeColor">@color/YourColor</item>

二、添加新的颜色属性

 <color name="mtrl_textinput_default_box_stroke_color" tools:override="true" >YourColor</color>

必须写同名mtrl_textinput_default_box_stroke_color不要改

【讨论】：

它对我有用，谢谢

【解决方案12】：

--->首先自定义样式

 <style name="Widget.TextInputLayout.FilledBox" parent="Widget.MaterialComponents.TextInputLayout.FilledBox">
    <item name="boxStrokeColor">?attr/colorSecondary</item>
    <item name="hintTextColor">?attr/colorSecondary</item>
</style>

其次，如果您想为整个应用程序中的所有 TextinputLayout 使用此样式。

所以将此样式添加到您的父主题中

<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryVariant">@color/colorPrimaryDark</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorSecondary">@color/colorSecondary</item>
    <item name="colorSecondaryVariant">@color/colorSecondaryVariant</item>
    <item name="android:textColorPrimary">@color/textColorPrimary</item>
    <item name="textInputStyle">@style/Widget.TextInputLayout.FilledBox</item>
</style>

如果您只想为这个特定的输入字段添加

<com.google.android.material.textfield.TextInputLayout
 style="@style/Widget.TextInputLayout.FilledBox"
 
 .....>

【讨论】：

【解决方案13】：

第 1 步。将此行添加到您的 colors.xml 文件中

<color  name="mtrl_textinput_default_box_stroke_color">#4169E1</color>

步骤 2. 在 TextInputLayout 中添加该属性

app:boxStrokeColor="@color/mtrl_textinput_default_box_stroke_color"

【讨论】：

【解决方案14】：

<style name="VerifyTextInputLayoutStyle" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense">
    <item name="boxStrokeColor">@color/colorWhite</item>
    <item name="boxStrokeWidth">2dp</item>
    <item name="colorOnSurface">@color/colorPrimary</item>
    <item name="colorPrimary">@color/colorWhite</item>
</style>

【讨论】：

【解决方案15】：

对于边框颜色：

 app:boxStrokeColor="@color/gray" //for border color

提示颜色：

 app:hintTextColor="@color/puce" //for hint color

【讨论】：