Ändern Sie die Ein-Farbe eines Schalters

Ich verwende ein Standard-Switch-Steuerelement mit dem Thema holo.light in einer ICS-App.

Ich möchte die hervorgehobene oder eingeschaltete Statusfarbe der Umschalttaste von hellblau auf grün ändern.

Das sollte einfach sein, aber ich kann anscheinend nicht herausfinden, wie es geht.

Ab sofort ist es besser, SwitchCompat aus der AppCompat.v7-Bibliothek zu verwenden. Sie können dann ein einfaches Styling verwenden, um die Farbe Ihrer Komponenten zu ändern.

values/themes.xml:

<style name="Theme.MyTheme" parent="Theme.AppCompat.Light">
    <!-- colorPrimary is used for the default action bar background -->
    <item name="colorPrimary">@color/my_awesome_color</item>

    <!-- colorPrimaryDark is used for the status bar -->
    <item name="colorPrimaryDark">@color/my_awesome_darker_color</item>

    <!-- colorAccent is used as the default value for colorControlActivated,
         which is used to tint widgets -->
    <item name="colorAccent">@color/accent</item>

    <!-- You can also set colorControlNormal, colorControlActivated
         colorControlHighlight, and colorSwitchThumbNormal. -->

</style>

Ref: Android-Entwickler-Blog

EDIT :

Die Art und Weise, wie es korrekt angewendet werden sollte, ist durch android:theme="@style/Theme.MyTheme" und dies kann auch auf übergeordnete Stile wie EditTexts, RadioButtons, Switches, CheckBoxes und ProgressBars angewendet werden:

<style name="My.Widget.ProgressBar" parent="Widget.AppCompat.ProgressBar">

<style name="My.Widget.Checkbox" parent="Widget.AppCompat.CompoundButton.CheckBox">

Spät zum Feiern, aber so habe ich es gemacht

Stil

 <style name="SCBSwitch" parent="Theme.AppCompat.Light">
        <!-- active thumb & track color (30% transparency) -->
        <item name="colorControlActivated">#46bdbf</item>

        <!-- inactive thumb color -->
        <item name="colorSwitchThumbNormal">#f1f1f1
        </item>

        <!-- inactive track color (30% transparency) -->
        <item name="android:colorForeground">#42221f1f
        </item>
    </style>

Farben

Layout

<android.support.v7.widget.SwitchCompat
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:checked="false"
    android:theme="@style/SCBSwitch" />

Ergebnis

Siehe Farbänderung für aktivierte und deaktivierte Schalter

Dies funktioniert für mich (erfordert Android 4.1):

Switch switchInput = new Switch(this);
int colorOn = 0xFF323E46;
int colorOff = 0xFF666666;
int colorDisabled = 0xFF333333;
StateListDrawable thumbStates = new StateListDrawable();
thumbStates.addState(new int[]{android.R.attr.state_checked}, new ColorDrawable(colorOn));
thumbStates.addState(new int[]{-android.R.attr.state_enabled}, new ColorDrawable(colorDisabled));
thumbStates.addState(new int[]{}, new ColorDrawable(colorOff)); // this one has to come last
switchInput.setThumbDrawable(thumbStates);

Beachten Sie, dass der Status "Standard" zuletzt hinzugefügt werden muss, wie hier gezeigt.

Das einzige Problem, das ich sehe, ist, dass der "Daumen" des Schalters jetzt größer erscheint als der Hintergrund oder die "Spur" des Schalters. Ich denke, das liegt daran, dass ich immer noch das Standard-Track-Image verwende, um das herum etwas Leerraum ist. Als ich jedoch versuchte, das Titelbild mit dieser Technik anzupassen, schien mein Schalter eine Höhe von 1 Pixel zu haben, wobei nur ein Streifen des Ein / Aus-Textes angezeigt wurde. Es muss eine Lösung dafür geben, aber ich habe sie noch nicht gefunden ...

Update für Android 5

In Android 5 lässt der obige Code den Schalter vollständig verschwinden. Wir sollten in der Lage sein, die neue setButtonTintList- Methode zu verwenden, aber dies scheint für Schalter ignoriert zu werden. Aber das funktioniert:

ColorStateList buttonStates = new ColorStateList(
        new int[][]{
                new int[]{-android.R.attr.state_enabled},
                new int[]{android.R.attr.state_checked},
                new int[]{}
        },
        new int[]{
                Color.BLUE,
                Color.RED,
                Color.GREEN
        }
);
switchInput.getThumbDrawable().setTintList(buttonStates);
switchInput.getTrackDrawable().setTintList(buttonStates);

Update für Android 6-7

Wie Cheruby in den Kommentaren feststellte, können wir das Neue verwenden setThumbTintListund das hat wie erwartet für mich funktioniert. Wir können auch verwenden setTrackTintList, aber das wendet die Farbe als Mischung an, mit einem Ergebnis, das bei dunklen Farbthemen dunkler als erwartet und bei hellen Farbthemen heller als erwartet ist, manchmal bis zur Unsichtbarkeit. In Android 7 konnte ich diese Änderung minimieren, indem ich den Track- Tint-Modus überschrieb. In Android 6 konnte ich jedoch keine anständigen Ergebnisse erzielen. Möglicherweise müssen Sie zusätzliche Farben definieren, die die Überblendung kompensieren. (Haben Sie jemals das Gefühl, dass Google nicht möchte, dass wir das Erscheinungsbild unserer Apps anpassen?)

ColorStateList thumbStates = new ColorStateList(
        new int[][]{
                new int[]{-android.R.attr.state_enabled},
                new int[]{android.R.attr.state_checked},
                new int[]{}
        },
        new int[]{
                Color.BLUE,
                Color.RED,
                Color.GREEN
        }
);
switchInput.setThumbTintList(thumbStates);
if (Build.VERSION.SDK_INT >= 24) {
    ColorStateList trackStates = new ColorStateList(
            new int[][]{
                    new int[]{-android.R.attr.state_enabled},
                    new int[]{}
            },
            new int[]{
                    Color.GRAY,
                    Color.LTGRAY
            }
    );
    switchInput.setTrackTintList(trackStates);
    switchInput.setTrackTintMode(PorterDuff.Mode.OVERLAY);
}

Um den Switch-Stil zu ändern, ohne style.xml oder Java-Code zu verwenden, können Sie den Switch in Layout-XML anpassen:

<Switch
        android:id="@+id/checkbox"
        android:layout_width="wrap_content"
        android:thumbTint="@color/blue"
        android:trackTint="@color/white"
        android:checked="true"
        android:layout_height="wrap_content" />

Es ist das Attribut android: thumbTint und android: trackTint , mit dem Sie die Farbe anpassen können

Dies ist das visuelle Ergebnis für dieses XML:

Erstellen Sie einen benutzerdefinierten Schalter und überschreiben Sie setChecked, um die Farbe zu ändern:

  public class SwitchPlus extends Switch {

    public SwitchPlus(Context context) {
        super(context);
    }

    public SwitchPlus(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public SwitchPlus(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void setChecked(boolean checked) {
        super.setChecked(checked);
        changeColor(checked);
    }

    private void changeColor(boolean isChecked) {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            int thumbColor;
            int trackColor;

            if(isChecked) {
                thumbColor = Color.argb(255, 253, 153, 0);
                trackColor = thumbColor;
            } else {
                thumbColor = Color.argb(255, 236, 236, 236);
                trackColor = Color.argb(255, 0, 0, 0);
            }

            try {
                getThumbDrawable().setColorFilter(thumbColor, PorterDuff.Mode.MULTIPLY);
                getTrackDrawable().setColorFilter(trackColor, PorterDuff.Mode.MULTIPLY);
            }
            catch (NullPointerException e) {
                e.printStackTrace();
            }
        }
    }
}

Während die Antwort von SubChord korrekt ist, wird die Frage, wie die "Ein" -Farbe eingestellt werden soll, nicht wirklich beantwortet, ohne auch andere Widgets zu beeinflussen. Verwenden Sie dazu a ThemeOverlayin styles.xml:

<style name="ToggleSwitchTheme" parent="ThemeOverlay.AppCompat.Light">
    <item name="colorAccent">@color/green_bright</item>
</style>

Und verweisen Sie in Ihrem Schalter darauf:

<android.support.v7.widget.SwitchCompat
  android:theme="@style/ToggleSwitchTheme" ... />

Dies wirkt sich NUR auf die Farbe der Ansichten aus, auf die Sie es anwenden möchten.

<androidx.appcompat.widget.SwitchCompat
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:thumbTint="@color/white"
                app:trackTint="@drawable/checker_track"/>

Und in checker_track.xml:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/lightish_blue" android:state_checked="true"/>
    <item android:color="@color/hint" android:state_checked="false"/>
</selector>

Ich habe es gelöst, indem ich den Farbfilter aktualisiert habe, als der Status des Schalters geändert wurde ...

public void bind(DetailItem item) {
    switchColor(item.toggle);
    listSwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
        @Override
        public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                switchColor(b);
        }
    });
}

private void switchColor(boolean checked) {
    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
        listSwitch.getThumbDrawable().setColorFilter(checked ? Color.BLACK : Color.WHITE, PorterDuff.Mode.MULTIPLY);
        listSwitch.getTrackDrawable().setColorFilter(!checked ? Color.BLACK : Color.WHITE, PorterDuff.Mode.MULTIPLY);
    }
}

Möglicherweise ist es etwas spät, aber für Schaltflächen ist die Google-Schaltfläche nicht die Antwort. Sie müssen die Zeichenfolge im XML-Parameter des Schalters ändern:

 android:thumb="your drawable here"

zeichne "newthumb.xml"

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/Green" android:state_checked="true"/>
    <item android:color="@color/Red" android:state_checked="false"/>
</selector>

und zeichne "newtrack.xml"

<selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item android:color="@color/black" android:state_checked="true"/>
        <item android:color="@color/white" android:state_checked="false"/>
    </selector>

und füge es in Switch hinzu:

<Switch
        android:trackTint="@drawable/newtrack"
        android:thumbTint="@drawable/newthumb"
         />

Definieren Sie es in Android Lollipop und höher in Ihrem Themenstil:

<style name="BaseAppTheme" parent="Material.Theme">
    ...
    <item name="android:colorControlActivated">@color/color_switch</item>
</style>

Erstellen Sie Ihr eigenes 9-Patch-Bild und legen Sie es als Hintergrund für die Umschalttaste fest.

http://radleymarx.com/2011/simple-guide-to-9-patch/

Die von Arlomedia vorgeschlagene Lösung hat bei mir funktioniert. In Bezug auf sein Problem mit der Extraspace habe ich das Entfernen aller Polster zum Schalter gelöst.

BEARBEITEN

Wie gewünscht, hier was ich habe.

In der Layoutdatei befindet sich mein Schalter in einem linearen Layout und nach einer Textansicht.

<LinearLayout
        android:id="@+id/myLinearLayout"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_gravity="center_horizontal|center"
        android:gravity="right"
        android:padding="10dp"
        android:layout_marginTop="0dp"
        android:background="@drawable/bkg_myLinearLayout"
        android:layout_marginBottom="0dp">
        <TextView
            android:id="@+id/myTextForTheSwitch"
            android:layout_height="wrap_content"
            android:text="@string/TextForTheSwitch"
            android:textSize="18sp"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_horizontal|center"
            android:gravity="right"
            android:layout_width="wrap_content"
            android:paddingRight="20dp"
            android:textColor="@color/text_white" />
        <Switch
            android:id="@+id/mySwitch"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textOn="@string/On"
            android:textOff="@string/Off"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_horizontal"
            android:layout_toRightOf="@id/myTextForTheSwitch"
            android:layout_alignBaseline="@id/myTextForTheSwitch"
            android:gravity="right" />
    </LinearLayout>

Da ich mit Xamarin / Monodroid (min. Android 4.1) arbeite, lautet mein Code:

Android.Graphics.Color colorOn = Android.Graphics.Color.Green;
Android.Graphics.Color colorOff = Android.Graphics.Color.Gray;
Android.Graphics.Color colorDisabled = Android.Graphics.Color.Green;

StateListDrawable drawable = new StateListDrawable();
drawable.AddState(new int[] { Android.Resource.Attribute.StateChecked }, new ColorDrawable(colorOn));
drawable.AddState(new int[] { -Android.Resource.Attribute.StateEnabled }, new ColorDrawable(colorDisabled));
drawable.AddState(new int[] { }, new ColorDrawable(colorOff));

swtch_EnableEdit.ThumbDrawable = drawable;

swtch_EnableEdit wurde zuvor wie folgt definiert (Xamarin):

Switch swtch_EnableEdit = view.FindViewById<Switch>(Resource.Id.mySwitch);

Ich setze überhaupt keine Auffüllungen und rufe nicht .setPadding (0, 0, 0, 0) auf.

Sie können einen benutzerdefinierten Stil für das Switch-Widget festlegen, bei dem standardmäßig ein Farbakzent verwendet wird, wenn Sie einen benutzerdefinierten Stil für das Widget verwenden

<style name="switchStyle" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorPrimary</item>    <!-- set your color -->
</style>    

Sie können diese Bibliothek ausprobieren, einfach zu ändernde Farbe für die Umschalttaste.
https://github.com/kyleduo/SwitchButton

Versuchen Sie hier die richtige Antwort zu finden: Wählen Sie die Hintergrundfarbe von TextView aus . In zwei Worten sollten Sie Shape in XML mit Farbe erstellen und es dann in Ihrer Auswahl dem Status "Checked" zuweisen.

Ich weiß nicht, wie ich es mit Java machen soll, aber wenn Sie einen Stil für Ihre App definiert haben, können Sie diese Linie in Ihren Stil einfügen und Sie haben die gewünschte Farbe für mich, die ich verwendet habe # 3F51B5

<color name="ascentColor">#3F51B5</color>

Am einfachsten ist es, die Spurfarbe zu definieren und den Farbtonmodus auf src_over zu setzen, um 30% Transparenz zu entfernen.

android:trackTint="@drawable/toggle_style"
android:trackTintMode="src_over"

toggle_style.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/informationDefault"
        android:state_checked="true"
        />
    <item android:color="@color/textDisabled" android:state_checked="false"/>
</selector>

Als Ergänzung zu vorhandenen Antworten: Sie können Daumen und Spur mithilfe von Selektoren im res/colorOrdner anpassen , zum Beispiel:

switch_track_selector

<?xml version="1.0" encoding="utf-8"?>
<selector
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/lightBlue"
        android:state_checked="true" />
    <item android:color="@color/grey"/>
</selector>

switch_thumb_selector

<selector
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/darkBlue"
        android:state_checked="true" />
    <item android:color="@color/white"/>
</selector>

Verwenden Sie diese Selektoren, um Spur- und Daumentöne anzupassen:

<androidx.appcompat.widget.SwitchCompat
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:trackTint="@color/switch_track_selector"
    app:thumbTint="@color/switch_thumb_selector"/>

Beachten Sie, dass Standart Switchund androidNamespace für diese Attribute nur für API 23 und höher funktionieren. Verwenden Sie sie daher SwitchCompatmit appNamespacexmlns:app="http://schemas.android.com/apk/res-auto" als universelle Lösung.

Ergebnis:

In XML können Sie die Farbe wie folgt ändern:

 <androidx.appcompat.widget.SwitchCompat
    android:id="@+id/notificationSwitch"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:checked="true"
    app:thumbTint="@color/darkBlue"
    app:trackTint="@color/colorGrey"/>

Dynamisch können Sie ändern als:

Switch.thumbDrawable.setColorFilter(ContextCompat.getColor(requireActivity(), R.color.darkBlue), PorterDuff.Mode.MULTIPLY)

Lösung für Android Studio 3.6:

yourSwitch.setTextColor(getResources().getColor(R.color.yourColor));

Ändert die Textfarbe eines in der XML-Farbdatei definierten Werts (yourColor).