Standard Android Button mit einer anderen Farbe

Ich möchte die Farbe eines Standard-Android-Buttons leicht ändern, um besser mit dem Branding eines Kunden übereinzustimmen.

Der beste Weg, den ich bisher gefunden habe, ist, den Drawable des Buttons auf den folgenden Drawable zu ändern, der sich in res/drawable/red_button.xml :

       

Dafür muss ich jedoch drei verschiedene Zeichen für jede Schaltfläche erstellen, die ich anpassen möchte (eine für die Schaltfläche im Ruhezustand, eine für den Fokus und eine für die Schaltfläche, wenn sie gedrückt wird). Das scheint komplizierter und nicht trockener als ich brauche.

Alles, was ich wirklich tun möchte, ist eine Art Farbtransformation auf den Button anzuwenden. Gibt es einen einfacheren Weg, die Farbe eines Knopfes zu ändern, als ich es tue?

Solutions Collecting From Web of "Standard Android Button mit einer anderen Farbe"

Ich fand heraus, dass dies alles relativ einfach in einer Datei erledigt werden kann. custom_button.xml Sie etwas wie den folgenden Code in eine Datei mit dem Namen custom_button.xml und legen background="@drawable/custom_button" in der Schaltflächenansicht background="@drawable/custom_button" :

 < ?xml version="1.0" encoding="utf-8"?>                           

Nach der Antwort von Tomasz können Sie auch die Farbe der gesamten Schaltfläche mithilfe des PorterDuff-Multiplikationsmodus programmgesteuert festlegen. Dies ändert die Farbe der Schaltfläche und nicht nur den Farbton.

Wenn Sie mit einer standardmäßigen grau schattierten Schaltfläche beginnen:

 button.getBackground().setColorFilter(0xFFFF0000, PorterDuff.Mode.MULTIPLY); 

wird Ihnen einen rot schattierten Knopf geben,

 button.getBackground().setColorFilter(0xFF00FF00, PorterDuff.Mode.MULTIPLY); 

wird Ihnen eine grün schattierte Schaltfläche usw. geben, wobei der erste Wert die Farbe im Hex-Format ist.

Es multipliziert den aktuellen Wert der Schaltflächenfarbe mit dem Farbwert. Ich bin mir sicher, dass Sie mit diesen Modi noch viel mehr erreichen können.

Mike, Sie könnten sich für Farbfilter interessieren.

Ein Beispiel:

 button.getBackground().setColorFilter(new LightingColorFilter(0xFFFFFFFF, 0xFFAA0000)); 

Versuche dies, um die gewünschte Farbe zu erreichen.

Dies ist meine Lösung, die ab API 15 perfekt funktioniert. Diese Lösung behält alle Standard- RippleEffect , wie das Material RippleEffect . Ich habe es nicht auf niedrigeren APIs getestet, aber es sollte funktionieren.

Alles, was Sie tun müssen, ist:

1) Erstellen Sie einen Stil, der nur colorAccent ändert:

  

Ich empfehle, ThemeOverlay.AppCompat oder Ihr Haupt- AppTheme als Eltern zu verwenden, um den Rest Ihrer Stile AppTheme .

2) Fügen Sie diese zwei Zeilen zu Ihrem button Widget hinzu:

 style="@style/Widget.AppCompat.Button.Colored" android:theme="@style/Facebook.Button" 

Manchmal wird Ihr neuer colorAccent nicht in der Android Studio-Vorschau colorAccent , aber wenn Sie Ihre App auf dem Telefon starten, wird die Farbe geändert.


Beispielschaltflächen-Widget

  

Beispielschaltfläche mit benutzerdefinierter Farbe

Sie können AppCompatButton von appcompat-v7 jetzt auch mit dem Attribut backgroundTint :

  

Ich mag den Farbfiltervorschlag in früheren Antworten von @conjugatedirection und @Tomasz; Ich stellte jedoch fest, dass der bisher bereitgestellte Code nicht so einfach zu verwenden war, wie ich es erwartet hatte.

Erstens wurde nicht erwähnt, wo der Farbfilter angewendet und gelöscht werden sollte. Es ist möglich, dass es andere gute Orte gibt, um dies zu tun, aber was mir in den Sinn kam, war ein OnTouchListener .

Nach meiner Lektüre der ursprünglichen Frage wäre die ideale Lösung ohne Bilder. Die akzeptierte Antwort, die custom_button.xml von @emmby verwendet, ist wahrscheinlich besser als Farbfilter, wenn das Ihr Ziel ist. In meinem Fall beginne ich mit einem PNG-Bild von einem UI-Designer, wie der Button aussehen soll. Wenn ich den Hintergrund der Schaltfläche für dieses Bild festlege, ist die Standard-Hervorhebung der Lichter komplett verloren. Dieser Code ersetzt dieses Verhalten mit einem programmatischen Verdunkelungseffekt.

 button.setOnTouchListener(new OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { case MotionEvent.ACTION_DOWN: // 0x6D6D6D sets how much to darken - tweak as desired setColorFilter(v, 0x6D6D6D); break; // remove the filter when moving off the button // the same way a selector implementation would case MotionEvent.ACTION_MOVE: Rect r = new Rect(); v.getLocalVisibleRect(r); if (!r.contains((int) event.getX(), (int) event.getY())) { setColorFilter(v, null); } break; case MotionEvent.ACTION_OUTSIDE: case MotionEvent.ACTION_CANCEL: case MotionEvent.ACTION_UP: setColorFilter(v, null); break; } return false; } private void setColorFilter(View v, Integer filter) { if (filter == null) v.getBackground().clearColorFilter(); else { // To lighten instead of darken, try this: // LightingColorFilter lighten = new LightingColorFilter(0xFFFFFF, filter); LightingColorFilter darken = new LightingColorFilter(filter, 0x000000); v.getBackground().setColorFilter(darken); } // required on Android 2.3.7 for filter change to take effect (but not on 4.0.4) v.getBackground().invalidateSelf(); } }); 

Ich extrahierte dies als eine separate class für die Anwendung auf mehrere Schaltflächen – als anonyme innere class gezeigt, nur um die Idee zu bekommen.

Wenn Sie Farbschaltflächen mit XML erstellen, können Sie den Code ein wenig sauberer machen, indem Sie den fokussierten und gedrückten Zustand in einer separaten Datei angeben und wiederverwenden. Mein grüner Knopf sieht so aus:

 < ?xml version="1.0" encoding="utf-8"?>             

Die kürzeste Lösung, die mit jeder Android-Version funktioniert:

 

Hinweise / Anforderungen :

  • Benutze die app: namespace und nicht den android: namespace!
  • appcompat-Version> 24.2.0

    Abhängigkeiten {compile 'com.android.support:appcompat-v7:25.3.1'}

Erklärung : Bildbeschreibung hier eingeben

Ich verwende diesen Ansatz

style.xml

    

Wie Sie von oben sehen können, verwende ich einen benutzerdefinierten Stil für meine Schaltfläche. Die Schaltflächenfarbe entspricht der Akzentfarbe. Ich finde das ein viel besserer Ansatz als das Setzen von android:background da ich nicht den Welleneffekt verlieren werde, den Google bietet.

Es gibt jetzt einen viel einfacheren Weg: android-holo-colors.com

Damit können Sie die colors aller Holo-Zeichen (Buttons, Spinner, …) einfach ändern. Sie wählen die Farbe aus und laden dann eine Zip-Datei herunter, die Zeichen für alle Auflösungen enthält.

Benutze es auf diese Weise:

 buttonOBJ.getBackground().setColorFilter(Color.parseColor("#YOUR_HEX_COLOR_CODE"), PorterDuff.Mode.MULTIPLY); 

In benutze android:background="#33b5e5" . oder besser android:background="@color/navig_button"

Die DroidUX- Komponentenbibliothek hat ein ColorButton Widget, dessen Farbe leicht geändert werden kann, sowohl per XML-Definition als auch programmgesteuert zur Laufzeit, so dass Sie die Farbe / das Design der Schaltfläche selbst festlegen können, wenn Ihre App dies zulässt.

Sie können dieses Online-Tool auch verwenden, um Ihre Schaltfläche http://angrytools.com/android/button/ anzupassen und android:background="@drawable/custom_btn" zu verwenden, um die benutzerdefinierte Schaltfläche in Ihrem Layout zu definieren.

Sie können das Thema Ihrer Schaltfläche festlegen

  

Eine einfache Möglichkeit besteht darin, eine benutzerdefinierte Button-class zu definieren, die alle gewünschten Eigenschaften wie Radius, Verlauf, gedrückte Farbe, normale Farbe usw. akzeptiert und diese dann in Ihren XML-Layouts verwendet, anstatt den Hintergrund mithilfe von XML einzurichten. Eine Probe ist hier

Dies ist sehr nützlich, wenn Sie viele Schaltflächen mit denselben Eigenschaften wie Radius, ausgewählte Farbe usw. haben. Sie können die geerbte Schaltfläche anpassen, um mit diesen zusätzlichen Eigenschaften umzugehen.

Ergebnis (Es wurde kein Hintergrundselektor verwendet).

Normaler Knopf

Normales Bild

Gedrückte Taste

Bildbeschreibung hier eingeben

Die Art und Weise, wie ich einen anders gestalteten Button ausführe, der ganz gut funktioniert, ist die Unterklasse des Button-Objekts und die Anwendung eines Farbfilters. Dies behandelt auch aktivierte und deaktivierte Status, indem ein Alpha auf die Schaltfläche angewendet wird.

 import android.annotation.TargetApi; import android.content.Context; import android.graphics.Color; import android.graphics.ColorFilter; import android.graphics.LightingColorFilter; import android.graphics.drawable.Drawable; import android.graphics.drawable.LayerDrawable; import android.os.Build; import android.util.AttributeSet; import android.widget.Button; public class DimmableButton extends Button { public DimmableButton(Context context) { super(context); } public DimmableButton(Context context, AttributeSet attrs) { super(context, attrs); } public DimmableButton(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } @SuppressWarnings("deprecation") @Override public void setBackgroundDrawable(Drawable d) { // Replace the original background drawable (eg image) with a LayerDrawable that // contains the original drawable. DimmableButtonBackgroundDrawable layer = new DimmableButtonBackgroundDrawable(d); super.setBackgroundDrawable(layer); } @TargetApi(Build.VERSION_CODES.JELLY_BEAN) @Override public void setBackground(Drawable d) { // Replace the original background drawable (eg image) with a LayerDrawable that // contains the original drawable. DimmableButtonBackgroundDrawable layer = new DimmableButtonBackgroundDrawable(d); super.setBackground(layer); } /** * The stateful LayerDrawable used by this button. */ protected class DimmableButtonBackgroundDrawable extends LayerDrawable { // The color filter to apply when the button is pressed protected ColorFilter _pressedFilter = new LightingColorFilter(Color.LTGRAY, 1); // Alpha value when the button is disabled protected int _disabledAlpha = 100; // Alpha value when the button is enabled protected int _fullAlpha = 255; public DimmableButtonBackgroundDrawable(Drawable d) { super(new Drawable[] { d }); } @Override protected boolean onStateChange(int[] states) { boolean enabled = false; boolean pressed = false; for (int state : states) { if (state == android.R.attr.state_enabled) enabled = true; else if (state == android.R.attr.state_pressed) pressed = true; } mutate(); if (enabled && pressed) { setColorFilter(_pressedFilter); } else if (!enabled) { setColorFilter(null); setAlpha(_disabledAlpha); } else { setColorFilter(null); setAlpha(_fullAlpha); } invalidateSelf(); return super.onStateChange(states); } @Override public boolean isStateful() { return true; } } } 

Werte \ Stile.xml

   

dann:

     

Ergebnis