Standard Android Button mit einer anderen Farbe

Question

Ich möchte die Farbe einer Standard-Android-Schaltfläche leicht ändern, um sie besser an das Branding eines Kunden anzupassen.

Die beste Methode, die ich bisher gefunden habe, ist die Änderung der Button auf die Ziehharmonika, die sich in res/drawable/red_button.xml :

<?xml version="1.0" encoding="utf-8"?>    
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/red_button_pressed" />
    <item android:state_focused="true" android:drawable="@drawable/red_button_focus" />
    <item android:drawable="@drawable/red_button_rest" />
</selector>

Aber tun, dass erfordert, dass ich tatsächlich drei verschiedene Drawables für jede Schaltfläche, die ich anpassen möchten (eine für die Schaltfläche im Ruhezustand, eine, wenn fokussiert, und eine, wenn gedrückt) erstellen. Das scheint komplizierter und non-DRY als ich brauche.

Alles, was ich wirklich tun möchte, ist eine Art von Farbumwandlung auf die Schaltfläche anwenden. Gibt es einen einfacheren Weg zu gehen, über die Änderung einer Schaltfläche die Farbe als ich tun?

Answer 1

Eine einfache Möglichkeit besteht darin, eine benutzerdefinierte Schaltflächenklasse zu definieren, die alle gewünschten Eigenschaften wie Radius, Farbverlauf, gedrückte Farbe, normale Farbe usw. akzeptiert, und diese dann in Ihren XML-Layouts zu verwenden, anstatt den Hintergrund über XML einzurichten. Ein Beispiel ist aquí

Dies ist äußerst nützlich, wenn Sie viele Schaltflächen mit denselben Eigenschaften wie Radius, ausgewählte Farbe usw. haben. Sie können Ihre geerbte Schaltfläche anpassen, um diese zusätzlichen Eigenschaften zu behandeln.

Ergebnis (Es wurde kein Hintergrundselektor verwendet).

Normale Taste

Gedrückte Taste

Answer 2

Werte \styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

<style name="RedAccentButton" parent="ThemeOverlay.AppCompat.Light">
    <item name="colorAccent">#ff0000</item>
</style>

entonces:

<Button
    style="@style/Widget.AppCompat.Button.Colored"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="text" />

<Button
    style="@style/Widget.AppCompat.Button.Colored"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:enabled="false"
    android:text="text" />

<Button
    style="@style/Widget.AppCompat.Button.Colored"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="text"
    android:theme="@style/RedAccentButton" />

<Button
    style="@style/Widget.AppCompat.Button.Colored"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:enabled="false"
    android:text="text"
    android:theme="@style/RedAccentButton" />

Answer 3

Gemäß den Material-Design-Richtlinien müssen Sie den Stil wie folgt verwenden untenstehender Code

<style name="MyButton" parent="Theme.AppCompat.Light>
    <item name="colorControlHighlight">#F36F21</item>
    <item name="colorControlHighlight">#FF8D00</item>
</style>

und fügen Sie im Layout diese Eigenschaft zu Ihrer Schaltfläche hinzu

    android:theme="@style/MyButton"

Answer 4

Die Art und Weise, wie ich eine anders gestaltete Schaltfläche, die ganz gut funktioniert, ist das Button-Objekt unterzuordnen und einen Farbfilter anwenden. Dies behandelt auch aktivierte und deaktivierte Zustände durch die Anwendung eines Alpha auf die Schaltfläche.

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 (e.g. 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 (e.g. 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;
        }
    }

}

Answer 5

Es ist ganz einfach. Fügen Sie diese Abhängigkeit in Ihr Projekt ein und erstellen Sie eine Schaltfläche mit 1. Beliebiger Form 2. Beliebiger Farbe 3. Beliebiger Rand 4. Mit Materialeffekten

https://github.com/manojbhadane/QButton

<com.manojbhadane.QButton
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:text="OK"
       app:qb_backgroundColor="@color/green"
       app:qb_radius="100"
       app:qb_strokeColor="@color/darkGreen"
       app:qb_strokeWidth="5" />