Измените цвет "on" цвета коммутатора
Я использую стандартное управление Switch с помощью темы holo.light в приложении ICS.
Я хочу изменить выделенный цвет или цвет состояния кнопки Toggle от стандартного голубого до зеленого.
Это должно быть легко, но я не могу понять, как это сделать.
Ответы
Ответ 1
На данный момент лучше использовать 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
EDIT:
Способ его правильного применения - через android:theme="@style/Theme.MyTheme"
а также это может быть применено к родительским стилям, таким как EditTexts, RadioButtons, Switches, CheckBoxes и ProgressBars:
<style name="My.Widget.ProgressBar" parent="Widget.AppCompat.ProgressBar">
<style name="My.Widget.Checkbox" parent="Widget.AppCompat.CompoundButton.CheckBox">
Ответ 2
Поздно к вечеринке, но так я и сделал
Стиль
<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" />
Результат
См. изменение цветов для включения и отключения переключателя
![введите описание изображения здесь]()
Ответ 3
Это работает для меня (требуется 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);
Обратите внимание, что состояние "по умолчанию" должно быть добавлено последним, как показано здесь.
Единственная проблема, которую я вижу, состоит в том, что "большой палец" переключателя теперь кажется больше, чем фон или "дорожка" переключателя. Я думаю, потому что я все еще использую изображение дорожки по умолчанию, вокруг которого есть свободное место. Однако, когда я попытался настроить изображение дорожки, используя эту технику, мой переключатель, как оказалось, имел высоту 1 пиксель с появлением лишь небольшого количества включенного/выключенного текста. Для этого должно быть решение, но я еще не нашел его...
Обновление для Android 5
В Android 5 приведенный выше код заставляет переключатель полностью исчезнуть. Мы должны иметь возможность использовать новый метод setButtonTintList, но, похоже, это игнорируется для переключателей. Но это работает:
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);
Обновление для Android 6-7
Как сказал Херувим в комментариях, мы можем использовать новый 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);
}
Ответ 4
Создайте настраиваемый переключатель и переопределите 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();
}
}
}
}
Ответ 5
Чтобы изменить стиль 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:
![введите описание изображения здесь]()
Ответ 6
В то время как ответ 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" ... />
При этом он будет ТОЛЬКО влиять на цвет видов, к которым вы хотите применить его.
Ответ 7
Я решил его, обновив цветной фильтр, когда состояние переключателя было изменено...
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);
}
}
Ответ 8
Может быть, он немного опоздал, но для кнопок переключателей кнопка Google не является ответом, вы должны изменить выделение в xml-параметре коммутатора:
android:thumb="your drawable here"
Ответ 9
<androidx.appcompat.widget.SwitchCompat
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:thumbTint="@color/white"
app:trackTint="@drawable/checker_track"/>
И внутри 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>
Ответ 10
Создайте собственное изображение с 9 патчами и установите его как фон кнопки переключения.
http://radleymarx.com/2011/simple-guide-to-9-patch/
Ответ 11
В Android Lollipop и выше определите его в своем стиле:
<style name="BaseAppTheme" parent="Material.Theme">
...
<item name="android:colorControlActivated">@color/color_switch</item>
</style>
Ответ 12
Решение, предложенное 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).
Ответ 13
вы можете создать собственный стиль для виджета коммутатора
которые используют цветной акцент в качестве значения по умолчанию, когда пользовательский стиль для него
<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>
Ответ 14
Вы можете попробовать эту библиотеку, легко изменить цвет для кнопки переключения.
https://github.com/kyleduo/SwitchButton
![enter image description here]()
Ответ 15
Попробуйте найти правильный ответ здесь: Селектор на цвет фона TextView.
В двух словах вы должны создать Shape в XML с цветом, а затем назначить ему состояние "checked" в вашем селекторе.
Ответ 16
Я не знаю, как это сделать из java. Но если у вас есть стиль, определенный для вашего приложения, вы можете добавить эту строку в свой стиль, и у вас будет необходимый цвет для меня. Я использовал # 3F51B5
<color name="ascentColor">#3F51B5</color>
Ответ 17
сделать drawable "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>
и создайте нарисованный "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>
и добавьте его в Switch:
<Switch
android:trackTint="@drawable/newtrack"
android:thumbTint="@drawable/newthumb"
/>