Как изменить цвет линии в EditText

122

Я создаю EditText в моем XML файле макета

Но я хочу изменить цветную линию в EditText от Holo до (например) красного цвета. Как это можно сделать?

Изображение 318

Теги:
layout
styles

19 ответов

206
Лучший ответ

Это лучший инструмент, который вы можете использовать для всех видов, и он БЕСПЛАТНЫЙ благодаря @Jérôme Van Der Linden.

Генератор цветов Holo для Android позволяет легко создавать компоненты Android, такие как EdiText или Spinner, с собственными цветами для приложения Android. Он сгенерирует все девять необходимых исправлений, а также соответствующие XML-элементы и стили, которые вы можете скопировать прямо в ваш проект.

http://android-holo-colors.com/

ОБНОВЛЕНИЕ 1

Срок действия этого домена истек, но проект с открытым исходным кодом вы можете найти здесь

https://github.com/jeromevdl/android-holo-colors

попытайся

это изображение помещено в фон EditText

android:background="@drawable/textfield_activated"

Изображение 4518


ОБНОВЛЕНИЕ 2

Для API 21 или выше, вы можете использовать android:backgroundTint

<EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Underline color change"
        android:backgroundTint="@android:color/holo_red_light" />

Обновление 3 Теперь у нас есть с задней поддержкой AppCompatEditText

Примечание: нам нужно использовать app: backgroundTint вместо android: backgroundTint

<android.support.v7.widget.AppCompatEditText
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:hint="Underline color change"
    app:backgroundTint="@color/blue_gray_light" />
  • 0
    Ссылка кажется мертвой? Программное обеспечение все еще доступно?
  • 1
    @CodingJohn этот проект с открытым исходным кодом вы можете найти здесь github.com/jeromevdl/android-holo-colors
Показать ещё 3 комментария
142

Мне не нравятся предыдущие ответы. Лучшее решение - использовать:

<android.support.v7.widget.AppCompatEditText

      app:backgroundTint="@color/blue_gray_light" />

android: backgroundTint для EditText работает только с API21 +. Из-за этого нам нужно использовать библиотеку поддержки и AppCompatEditText.

Примечание: мы должны использовать app: backgroundTint вместо android: backgroundTint.

  • 3
    Это лучшее решение! Простой и работает на всех уровнях API. Спасибо!
  • 5
    вам это не нужно, если вы используете библиотеку appcompat, EdtiTexts автоматически преобразуются в AppCompatEditText и применяется оттенок фона.
Показать ещё 3 комментария
66

Вы также можете быстро изменить цвет подчеркивания EditText, изменив цвет фона EditText следующим образом:

<EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Something or Other"
            android:backgroundTint="@android:color/holo_green_light" />
  • 17
    Работает только в API 21 или выше. Любой способ заставить это работать для меньшего уровня API?
  • 0
    Проверьте реверс-решение stackoverflow.com/questions/26574328/…
Показать ещё 3 комментария
16

Программно, вы можете попробовать:

editText.getBackground().mutate().setColorFilter(getResources().getColor(android.R.color.holo_red_light), PorterDuff.Mode.SRC_ATOP);
  • 2
    Лучший ответ для эффекта Xamarin.Forms
  • 0
    Но он не возвращается к цвету по умолчанию, когда размытие ..
Показать ещё 1 комментарий
9

для API ниже 21 вы можете использовать атрибут theme в edittext, поместить приведенный ниже код в файл стиля

<style name="MyEditTextTheme">
        <item name="colorControlNormal">#FFFFFF</item>
        <item name="colorControlActivated">#FFFFFF</item>
        <item name="colorControlHighlight">#FFFFFF</item>
    </style>

использовать этот стиль в тексте редактирования как

<EditText       android:id="@+id/etPassword"
                android:layout_width="match_parent"
                android:layout_height="@dimen/user_input_field_height"
                android:layout_marginTop="40dp"
                android:hint="@string/password_hint"
                android:theme="@style/MyEditTextTheme"
                android:singleLine="true" />
  • 0
    Вы знаете, как добавить альфа / непрозрачность в файл стиля? Как будто он должен взять обычный цвет с непрозрачностью, и как только они начнут печатать, он должен взять активированный или выделенный цвет
  • 1
    @ ANS для этого вам нужно добавить слушатель текстового наблюдателя и динамически установить прозрачность в методе "onTextChanged"
Показать ещё 2 комментария
9

Я думаю, что лучший способ - по теме:

<style name="MyEditTextTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="colorControlNormal">@color/black</item>
        <item name="colorControlActivated">@color/action_blue</item>
        <item name="colorControlHighlight">@color/action_blue</item>
    </style>

<style name="addressbookitem_edit_style" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:textSize">13sp</item>

<item name="android:theme">@style/MyEditTextTheme</item>

<android.support.v7.widget.AppCompatEditText
            style="@style/addressbookitem_edit_style"/>
  • 1
    это не работает для меня с тегом стиля, но с Android: тег темы
9

Чтобы изменить цвет подчеркивания Edittexts:

Если вы хотите, чтобы все приложение делилось этим стилем, вы можете сделать следующий путь.

(1) перейдите в файл styles.xml. Ваш AppTheme, который наследует родителя Theme.AppCompat.Light.DarkActionBar(в моем случае), будет основным родителем всех файлов стилей вашего приложения. Измените его имя на "AppBaseTheme". Сделайте еще один стиль под ним, который имеет имя AppTheme и наследует от AppBaseTheme, который вы только что отредактировали. Он будет выглядеть следующим образом:

<!-- Base application theme. -->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="windowActionBar">false</item>
    <!--see http://www.google.com/design/spec/style/color.html#color-color-palette-->
    <item name="colorPrimary">@color/material_brown_500</item>
    <item name="colorPrimaryDark">@color/material_brown_700</item>
    <item name="colorAccent">@color/flamingo</item>

<style name="AppTheme" parent="AppBaseTheme">
    <!-- Customize your theme here. -->
</style>

Затем измените "colorAccent" на любой цвет, который вы хотите на цвет линии EditText.

(2) Если у вас есть другие папки с параметрами style.xml, этот шаг очень важен. Поскольку этот файл наследуется от вашего предыдущего родительского xml файла. Например, у меня есть значения -19/styles.xml. Это специально для Kitkat и выше. Измените родителя на AppBaseTheme и убедитесь, что вы избавились от "colorAccent", чтобы он не переопределял цвет родителей. Также вам нужно сохранить элементы, характерные для версии 19. Затем он будет выглядеть следующим образом.

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <item name="android:windowTranslucentStatus">true</item>
    </style>
</resources>
6

Цвет линии определяется свойством фона EditText. Чтобы изменить его, вы должны изменить android:background в файле макета.

Я должен отметить, что этот стиль достигается за счет использования 9-патча. Если вы посмотрите в SDK, вы увидите, что фон EditText - это изображение:

Изображение 4519

Чтобы изменить его, вы можете открыть его в программе обработки изображений и покрасить его в нужный цвет. Сохраните его как bg_edit_text.9.png, а затем поместите его в свою папку. Теперь вы можете применить его в качестве фона для вашего EditText следующим образом:

android:background="@drawable/bg_edit_text"
  • 2
    Да, это работает! Большое спасибо!
4

Фон виджетов зависит от уровня API.

АЛЬТЕРНАТИВА 1

Вы можете создать собственное изображение на фоне EditText на

android:background="@drawable/custom_editText"

Ваше изображение должно выглядеть примерно так. Это даст вам желаемый эффект.

Изображение 4520

АЛЬТЕРНАТИВА 2

Установите этот xml в свой фоновый атрибут EditText.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="rectangle" android:padding="10dp">
<solid android:color="#4C000000"/>
    <corners android:bottomRightRadius="5dp"
             android:bottomLeftRadius="5dp"
             android:topLeftRadius="5dp"
             android:topRightRadius="5dp"/>
</shape>

Это будет выглядеть так же, как и ваш EditText для каждого API.

  • 0
    Я заинтересован в версии 4.0 и выше. То есть я просто хочу изменить цвет линии при активном EditText
3

Это довольно просто (требуется: минимум 21 API)...

  1. Перейдите в свой XML и выберите поле EditText
  2. На правой стороне вы можете увидеть окно "Атрибуты". Выберите "Просмотреть все атрибуты"
  3. Просто найдите "оттенок"
  4. И добавьте/измените 'backgroundTint' на желаемый цветной гекс (скажем, # FF0000)

Изображение 4521

Изображение 4522

Продолжайте кодировать........ :)

  • 2
    Минимальный API 21.
3

Вы можете изменить цвет с тонированием фона    <EditText android:backgroundTint="@color/red"/>

  • 1
    это работает только для API> 21, вы должны следовать ответу @Rahul для всех API или добавить различные макеты для API> 21 в папке layout-21
3

Вы можете изменить цвет EditText программно, используя эту строку кода: edittext.setBackgroundTintList(ColorStateList.valueOf(yourcolor));

  • 0
    Но он не возвращается к цвету по умолчанию, когда размытие ....
3

Если вам нужна плоская линия, вы можете сделать это легко с помощью xml. Вот пример xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:top="-1dp"
        android:left="-1dp"
        android:right="-1dp"
        android:bottom="1dp"
        >
        <shape android:shape="rectangle">
            <stroke android:width="1dp" android:color="#6A9A3A"/>
        </shape>
    </item>
</layer-list>

Замените фигуру селектором, если вы хотите предоставить различную ширину и цвет для сфокусированного edittext.

  • 1
    с дизайном материала создает прямоугольник с более широкой нижней линией
2

Лучший подход - использовать атрибут AppCompatEditText с backgroundTint в пространстве имен app. то есть.

    <android.support.v7.widget.AppCompatEditText
    android:layout_width="match_parent"      
    app:backgroundTint="YOUR COLOR"
    android:layout_height="wrap_content" />

когда мы используем android:backgroundTint, он будет работать только в API21 или более, но app:backgroundTint работает на всех уровнях API, которые делает ваше приложение.

2

Используйте этот метод.. и измените его в соответствии с именами имени ur. Этот код отлично работает.

 private boolean validateMobilenumber() {
            if (mobilenumber.getText().toString().trim().isEmpty() || mobilenumber.getText().toString().length() < 10) {
                input_layout_mobilenumber.setErrorEnabled(true);
                input_layout_mobilenumber.setError(getString(R.string.err_msg_mobilenumber));
               // requestFocus(mobilenumber);
                return false;
            } else {
                input_layout_mobilenumber.setError(null);
                input_layout_mobilenumber.setErrorEnabled(false);
                mobilenumber.setBackground(mobilenumber.getBackground().getConstantState().newDrawable());
            }
1

Попробуйте выполнить следующий путь: он преобразует нижний цвет текста EditText, когда используется как свойство фона.

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:left="@dimen/spacing_neg"
        android:right="@dimen/spacing_neg"
        android:top="@dimen/spacing_neg">
        <shape>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="@dimen/spacing_1"
                android:color="@android:color/black" />
        </shape>
    </item>
</layer-list>
1
 <EditText
        android:id="@+id/et_password_tlay"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Password"
        android:textColorHint="#9e9e9e"
        android:backgroundTint="#000"
        android:singleLine="true"
        android:drawableTint="#FF4081"
        android:paddingTop="25dp"
        android:textColor="#000"
        android:paddingBottom="5dp"
        android:inputType="textPassword"/>

    <View
        android:id="@+id/UnderLine"
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_below="@+id/et_password_tlay"
        android:layout_centerHorizontal="true"
        android:background="#03f94e" />

** это один из видов с представлением **

1

Используйте свойство android: background для этого edittext. Передайте изображение с его доступной папкой. Например,

android:background="@drawable/abc.png"
0

Это можно просто сделать, включив этот android:theme="@style/AppTheme.AppBarOverlay качестве атрибута для вашего editText и добавив этот <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar"/> в ваших стилях

Ещё вопросы

Сообщество Overcoder
Наверх
Меню