So ändern Sie die Linienfarbe in EditText


203

Ich erstelle einen EditText in meiner Layout-XML-Datei

Aber ich möchte die Farblinie in EditText von Holo in (zum Beispiel) Rot ändern. Wie kann das gemacht werden?

Geben Sie hier die Bildbeschreibung ein

Antworten:


310

Dies ist das beste Tool, das Sie für alle Ansichten verwenden können, und dank @ Jérôme Van Der Linden ist es KOSTENLOS .

Mit dem Android Holo Colors Generator können Sie ganz einfach Android-Komponenten wie EditTextoder Spinner mit Ihren eigenen Farben für Ihre Android-Anwendung erstellen. Es werden alle erforderlichen neun Patch-Assets sowie die dazugehörigen XML-Zeichen und Stile generiert, die Sie direkt in Ihr Projekt kopieren können.

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

UPDATE 1

Diese Domain scheint abgelaufen zu sein, aber das Projekt ist eine Open Source, die Sie hier finden können

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

Versuch es

Dieses Bild im Hintergrund von EditText

android:background="@drawable/textfield_activated"

Geben Sie hier die Bildbeschreibung ein


UPDATE 2

Für API 21 oder höher können Sie verwenden 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" />

Update 3 Jetzt haben wir mit RückenunterstützungAppCompatEditText

Hinweis: Wir müssen app: backgroundTint anstelle von android: backgroundTint verwenden

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

Link scheint tot zu sein? Ist die Software noch verfügbar?
Codierung John

1
@CodingJohn Dieses Projekt ist Open Source. Sie finden es hier. Github.com/jeromevdl/android-holo-colors
MilapTank

und wer sagt, dass wir "app: backgroundTint anstelle von android: backgroundTint" verwenden müssen?
user924

Wenn Sie Abwärtskompatibilität wünschen , können Sie App verwenden: *** OW android: ***
MilapTank

202

Ich mag keine vorherigen Antworten. Die beste Lösung ist zu verwenden:

<android.support.v7.widget.AppCompatEditText

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

android:backgroundTintfür EditTextfunktioniert nur auf API21 + . Aus diesem Grund müssen wir die Support-Bibliothek und verwenden AppCompatEditText.

Hinweis: Wir müssen app:backgroundTintanstelle von verwendenandroid:backgroundTint

AndroidX-Version

<androidx.appcompat.widget.AppCompatEditText

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

3
Dies ist die beste Lösung! Einfach und funktioniert auf allen API-Ebenen. Vielen Dank!
Ivo Stoyanov

7
Sie brauchen das nicht, wenn Sie die Appcompat-Bibliothek verwenden. EdtiTexts werden automatisch in AppCompatEditText umgewandelt und der Hintergrundfarbton angewendet.
stephane k.

Ich denke, das sollte genau die Lösung sein
Thuy Nguyen

Vielen Dank. Es funktionierte für API 16+. Beste Lösung.
André Luiz Reis

2
App: backgroundTint programmgesteuert einstellen? Ich konnte eine Methode 'setBackgroundTint'
Sarath Nagesh

75

Sie können die Unterstreichungsfarbe des EditText auch schnell ändern, indem Sie den Hintergrund des EditText wie folgt tönen:

<EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="Something or Other"
            android:backgroundTint="@android:color/holo_green_light" />

18
Funktioniert nur in API 21 oder höher. Gibt es eine Möglichkeit, dies für eine niedrigere API-Ebene zum Laufen zu bringen?
Vucko

Überprüfen Sie reVerse Lösung stackoverflow.com/questions/26574328/…
Pulver366

@ mladj0ni Cool, + 1d
Vucko

3
Verwenden Sie für kleinere API-Levels nur "backgroundTint" anstelle von "android: backgroundTint". Credits stackoverflow.com/a/29400711/1590911
Hasaan Ali

Dies ändert die gesamte Hintergrundfarbe, nicht die Linienfarbe
Code Wiget

29

Für APIs unter 21 können Sie das Theme-Attribut verwenden, EditText um den folgenden Code in die Style-Datei einzufügen

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

Verwenden Sie diesen Stil in EditTextas

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

Wissen Sie, wie Sie der Stildatei Alpha / Deckkraft hinzufügen können? Als ob es die normale Farbe mit einer Deckkraft annehmen sollte und sobald sie anfangen zu tippen, sollte es die aktivierte oder hervorgehobene Farbe annehmen
ASN

1
@ANS dafür müssen Sie einen Text-Watcher-Listener hinzufügen und die Deckkraft in der "onTextChanged" -Methode dynamisch einstellen
Rahul

Oh. Es kann also nicht zur Styling- oder Auswahldatei hinzugefügt werden und sollte dynamisch erfolgen?
ASN

@ ASN Deckkraft wird in hexadezimaler Farbe in den ersten beiden Zeichen 00-FF hinzugefügt, zum Beispiel: # A1FAFAFA
aimiliano

21

Programmatisch können Sie versuchen:

editText.getBackground().mutate().setColorFilter(getResources().getColor(android.R.color.holo_red_light), PorterDuff.Mode.SRC_ATOP);

2
Beste Antwort für Xamarin.Forms-Effekt
mister_giga

11

Ich denke, der beste Weg ist nach Thema:

<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="AddressBookStyle" 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>
</style>

<android.support.v7.widget.AppCompatEditText
            style="@style/AddressBookStyle"/>

2
Dies funktioniert nicht für mich mit Style-Tag, sondern mit Android: Theme-Tag
Aimiliano

9

So ändern Sie die Unterstreichungsfarbe von Edittext:

Wenn Sie möchten, dass die gesamte App diesen Stil teilt, können Sie wie folgt vorgehen.

(1) Gehen Sie zur Datei styles.xml. Ihr AppTheme, das das übergeordnete Element von Theme.AppCompat.Light.DarkActionBar (in meinem Fall) erbt, ist das übergeordnete Element aller Stildateien in Ihrer App. Ändern Sie den Namen in "AppBaseTheme". Erstellen Sie direkt darunter einen anderen Stil, der den Namen AppTheme trägt und von AppBaseTheme erbt, den Sie gerade bearbeitet haben. Es wird wie folgt aussehen:

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

Ändern Sie dann den „colorAccent“ in die Farbe, die Ihre EditText-Linienfarbe haben soll.

(2) Wenn Sie andere Werteordner mit style.xml haben, ist dieser Schritt sehr wichtig. Weil diese Datei von Ihrer vorherigen übergeordneten XML-Datei erbt. Zum Beispiel habe ich values-19 / styles.xml. Dies ist speziell für Kitkat und höher. Ändern Sie das übergeordnete Element in AppBaseTheme und entfernen Sie "colorAccent", damit die übergeordnete Farbe nicht überschrieben wird. Außerdem müssen Sie die für Version 19 spezifischen Elemente behalten. Dann sieht es so aus.

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

9

Es ist ziemlich einfach (Erforderlich: Minimum API 21) ...

  1. Gehen Sie zu Ihrer XML und wählen Sie das Feld EditText
  2. Auf der rechten Seite sehen Sie das Fenster 'Attribute'. Wählen Sie "Alle Attribute anzeigen".
  3. Suchen Sie einfach nach "Farbton"
  4. Und fügen Sie den 'backgroundTint' zu einem gewünschten Farbfeld hinzu (sagen Sie # FF0000).

Geben Sie hier die Bildbeschreibung ein

Geben Sie hier die Bildbeschreibung ein

Codierung weiter ........ :)


2
Minimum API 21.
Maihan Nijat

Durch Ändern der Hintergrundfarbe wird der HINTERGRUND geändert. Diese Antwort ist falsch
Code Wiget

6

Die Farbe der Linie wird durch EditTextdie Hintergrundeigenschaft definiert . Um es zu ändern, sollten Sie das android:backgroundin der Layoutdatei ändern .

Ich sollte beachten, dass dieser Stil durch die Verwendung eines 9-Patch-Drawable erreicht wird. Wenn Sie in das SDK schauen, können Sie sehen, dass der Hintergrund desEditText folgenden Bildes ist:

textfield_activated_holo_light.9.png

Um es zu ändern, können Sie es in einem Bildbearbeitungsprogramm öffnen und in der gewünschten Farbe ausmalen. Speichern Sie es als bg_edit_text.9.pngund legen Sie es dann in Ihrem Zeichenordner ab. Jetzt können Sie es als Hintergrund für Ihre EditTextArt anwenden, so:

android:background="@drawable/bg_edit_text"

5

Sie können die Farbe von EditText programmgesteuert ändern, indem Sie nur diese Codezeile verwenden:edittext.setBackgroundTintList(ColorStateList.valueOf(yourcolor));


Das suche ich! Thx
Jiratchaya Intaragumhaeng

4

Der Hintergrund von Widgets hängt von der API-Ebene ab .

ALTERNATIVE 1

Sie können Ihrem EditTextHintergrund ein benutzerdefiniertes Bild hinzufügen, indem Sie

android:background="@drawable/custom_editText"

Ihr Bild sollte ungefähr so ​​aussehen. Es gibt Ihnen den gewünschten Effekt.

Geben Sie hier die Bildbeschreibung ein

ALTERNATIVE 2

Setzen Sie diese XML auf Ihr EditTextHintergrundattribut.

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

Dies sieht EditTextauf jeder API gleich aus.


Ich interessiere mich für Version 4.0 und höher. Das heißt, ich möchte nur die Linienfarbe ändern, wenn EditText
Alex

4

Sie können die Farbe ändern, indem Sie den Hintergrund tönen <EditText android:backgroundTint="@color/red"/>


1
Dies funktioniert nur für API> 21 Sie sollten @ Rahul Antwort für alle APIs folgen oder verschiedene Layouts für API> 21 im Ordner Layout-21
hinzufügen

4

drawable / bg_edittext.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/transparent" />
        </shape>
    </item>

    <item
        android:left="-2dp"
        android:right="-2dp"
        android:top="-2dp">
        <shape>
            <solid android:color="@android:color/transparent" />
            <stroke
                android:width="1dp"
                android:color="@color/colorDivider" />
        </shape>
    </item>
</layer-list>

Auf EditText setzen

<android.support.v7.widget.AppCompatEditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/bg_edittext"/>

3

Verwenden Sie diese Methode .. und ändern Sie sie entsprechend Ihren Ansichtsnamen. Dieser Code funktioniert hervorragend.

 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());
            }

2

Wenn Sie eine flache Linie wünschen, können Sie dies einfach mit XML tun. Hier ist das XML-Beispiel:

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

Ersetzen Sie die Form durch einen Selektor, wenn Sie für fokussierten Edittext eine andere Breite und Farbe bereitstellen möchten.


1
mit Materialdesign schafft es Rechteck, mit breiterem
Endergebnis

2

Der beste Ansatz ist die Verwendung eines AppCompatEditTextwith- backgroundTintAttributs des appNamespace. dh

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

Wenn wir android:backgroundTintes verwenden, funktioniert es nur in API21 oder höher, aber app:backgroundTintauf allen API-Ebenen, die Ihre App ausführt .


1

Verwenden Sie die Eigenschaft android: background für diesen Edittext. Übergeben Sie Ihr Zeichenordnerbild. Beispielsweise,

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

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

** es geht darum, mit Aussicht zu tun **


1

Versuchen Sie Folgendes: Es wird die Grundfarbe von EditText konvertiert, wenn es als Hintergrundeigenschaft verwendet wird.

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

0

Dies können Sie einfach tun, indem Sie dies android:theme="@style/AppTheme.AppBarOverlayals Attribut für Ihren editText einfügen und dies <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />Ihren Stilen hinzufügen

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.