Изменить цвет «на» переключателя

Я использую стандартное управление Switch с помощью темы holo.light в приложении ICS.

Я хочу изменить выделенный цвет или цвет состояния кнопки Toggle от стандартного голубого до зеленого.

Это должно быть легко, но я не могу понять, как это сделать.

На данный момент лучше использовать SwitchCompat из библиотеки AppCompat.v7. Затем вы можете использовать простой стиль для изменения цвета ваших компонентов.

 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

Поздно к вечеринке, но так я и сделал

Стиль

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

Цвета

Введите описание изображения здесь

раскладка

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

результат

См. Изменение цветов для включения и отключения переключателя

Введите описание изображения здесь

Это работает для меня (требуется 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(this.app.colorOff)); // this one has to come last switchInput.setThumbDrawable(thumbStates); 

Обратите внимание, что состояние «по умолчанию» должно быть добавлено последним, как показано здесь.

Единственная проблема, которую я вижу, – это то, что «большой палец» переключателя теперь больше фона или «дорожки» переключателя. Я думаю, это потому, что я по-прежнему использую образ трека по умолчанию, в котором есть пустое пространство вокруг него. Однако, когда я попытался настроить образ трека с помощью этой техники, мой переключатель, по-видимому, имел высоту 1 пиксель, и только одна из них отображала текст вкл / выкл. Для этого должно быть решение, но я еще не нашел его …

Обновление для Android 5.1

В Android 5.1 вышеприведенный код полностью отключает коммутатор. Мы должны иметь возможность использовать новый метод setButtonTintList , но это не имело эффекта, когда я его пробовал. Теперь я использую этот код:

 switchInput.getThumbDrawable().setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY); switchInput.getTrackDrawable().setColorFilter(Color.RED, PorterDuff.Mode.MULTIPLY); 

Единственным недостатком является то, что невозможно установить цвет для отключенного состояния. Трек становится более бледным, но большой палец остается одного цвета, поэтому изменение более тонкое, чем хотелось бы.

Обновление для Android 5.1.1

По-видимому, метод setButtonTintList () имел ошибку в 5.1, которая была исправлена ​​в 5.1.1. Этот код теперь работает так, как ожидалось, без каких-либо недостатков, которые я вижу:

 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.setButtonTintList(buttonStates); 

Обновление для Android 6-7

В Android 6-7 setButtonTintList игнорируется на коммутаторах. Как сказано в комментариях к setThumbTintList , мы можем использовать новый setThumbTintList и работали как ожидалось для меня. Мы также можем использовать setTrackTintList , но это относится к цвету как к смеси, результат которого темнее, чем ожидалось, в темных цветовых тонах и легче, чем ожидалось, в светлых цветовых тонах, иногда до невидимого. В Android 7 мне удалось свести к минимуму эти изменения, переопределив режим отслеживания дорожек, но я не смог получить достойные результаты от того, что было в Android 6. Возможно, вам придется определить дополнительные цвета, которые компенсируют смешение. (У вас когда-либо возникает ощущение, что Google не хочет, чтобы мы настраивали внешний вид наших приложений?)

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

Создайте настраиваемый переключатель и переопределите setChecked, чтобы изменить цвет:

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

Может быть, он немного опоздал, но для кнопок переключателей кнопка Google не является ответом, вы должны изменить выделение в xml-параметре переключателя:

  android:thumb="your drawable here" 

Я решил его, обновив цветной фильтр, когда состояние переключателя было изменено …

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

Хотя ответ SubChord верен, на самом деле не отвечает на вопрос о том, как установить цвет «on», не затрагивая других виджетов. Для этого используйте ThemeOverlay в styles.xml:

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

И ссылайтесь на него в своем коммутаторе:

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

При этом он будет ТОЛЬКО влиять на цвет видов, к которым вы хотите применить его.

Создайте собственное изображение с 9 патчами и установите его в качестве фона кнопки переключения.

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

Чтобы изменить стиль Switch без использования кода style.xml или Java, вы можете настроить переключатель в макет XML:

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

Это атрибут android: thumbTint и android: trackTint, который позволяет настраивать цвет

Это визуальный результат для этого XML:

Введите описание изображения здесь

В Android Lollipop и выше определите его в своем стиле темы:

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

Решение, предложенное arlomedia, работало для меня. О его проблеме extraspace я решил удалить все прокладки к коммутатору.

РЕДАКТИРОВАТЬ

По просьбе, вот что у меня есть.

В файле макета мой коммутатор находится внутри линейного макета и после TextView.

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

Поскольку я работаю с Xamarin / Monodroid (мин. Android 4.1), мой код:

 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 предварительно определяется следующим образом (Xamarin):

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

Я вообще не устанавливаю paddings, и я не вызываю .setPadding (0, 0, 0, 0).

Я не знаю, как это сделать из java. Но если у вас есть стиль, определенный для вашего приложения, вы можете добавить эту строку в свой стиль, и у вас будет необходимый цвет для меня, я использовал # 3F51B5

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

Попробуйте найти правильный ответ здесь: Селектор на цвет фона TextView . В двух словах вы должны создать Shape в XML с цветом, а затем назначить его в поле «checked» в вашем селекторе.