Изменение цвета контура TextInputLayout

Я пытаюсь настроить 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>

Но когда текстовый ввод не сфокусирован, я получаю такой вид:

Как я могу изменить цвет черной линии, чтобы быть белым тоже. Спасибо

Ответы

Ответ 1

Используйте этот стиль, чтобы применить цвет границы и ширину границы следующим образом:

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

Получить дополнительную информацию о стайлинге по этой ссылке

Добавьте строку ниже в ваш файл colors.xml который переопределяет цвет по умолчанию для TextInputLayout

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

Ответ 2

Начиная с версии 1.1.0-alpha02 Материальных Компонентов для Android, он просто создает ColorStateList для этих элементов. Процедура выглядит следующим образом:

В 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"
    ...

Ответ 3

Что касается компонентов материала Alpha 7, вы просто создаете файл селектора цвета следующим образом: colors/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 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);
}

Из этого списка видно, что вы хотите убедиться, что используете селектор цвета со всеми определенными состояниями, иначе он по умолчанию вернется к другому цвету.

Ответ 4

Я создал конфигурацию по умолчанию.

 <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>

Ответ 5

<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>

Ответ 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

Я динамически создаю свой экран. Я использую Text Input Layout и создаю свой динамический текст редактирования в Text Input Layout. Если вы хотите присвоить макету ввода текста границу, выполните следующие шаги по порядку.

1- включает Build.gradle;

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

2- в коде Котлина;

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>

Ссылка на изображение моего компонента,

https://i.stack.imgur.com/FaPTI.png