[英]How to change the track color of a SwitchCompat
我嘗試使用以下鏈接更改SwitchCompat的顏色:
注意我的開關中的低對比度:
但在更改所有相關顏色值后,SwitchCompat的軌道(亮灰色)保持不變。 除了顏色,我不想改變外觀。 拇指是粉紅色的,我希望軌道有一些對比。 我錯過了在styles.xml中定義一個值嗎?
我嘗試了這些值(隨機非白色):
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">@color/first</item>
<item name="colorPrimaryDark">@color/second</item>
<item name="colorAccent">@color/third</item>
...
<item name="colorControlActivated">@color/first</item>
<item name="colorControlHighlight">@color/first</item>
<item name="colorControlNormal">@color/second</item>
<item name="colorSwitchThumbNormal">@color/second</item>
<item name="colorButtonNormal">@color/second</item>
...>
我有同樣的問題並解決了它。
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<!-- Active thumb color & Active track color(30% transparency) -->
<item name="colorControlActivated">@color/theme</item>
<!-- Inactive thumb color -->
<item name="colorSwitchThumbNormal">@color/grey300</item>
<!-- Inactive track color(30% transparency) -->
<item name="android:colorForeground">@color/grey600</item>
...
</style>
我閱讀app compat代碼,並了解它。
android.support.v7.internal.widget.TintManager.java
private ColorStateList getSwitchTrackColorStateList() {
if (mSwitchTrackStateList == null) {
final int[][] states = new int[3][];
final int[] colors = new int[3];
int i = 0;
// Disabled state
states[i] = new int[] { -android.R.attr.state_enabled };
colors[i] = getThemeAttrColor(android.R.attr.colorForeground, 0.1f);
i++;
states[i] = new int[] { android.R.attr.state_checked };
colors[i] = getThemeAttrColor(R.attr.colorControlActivated, 0.3f);
i++;
// Default enabled state
states[i] = new int[0];
colors[i] = getThemeAttrColor(android.R.attr.colorForeground, 0.3f);
i++;
mSwitchTrackStateList = new ColorStateList(states, colors);
}
return mSwitchTrackStateList;
}
以下是針對特定SwitchCompat以 編程方式更改軌道和拇指顏色的AppCompat方法。 在這個例子中,我將thumbColor
硬編碼為紅色。 理想情況下,您可以通過第二個方法參數設置顏色。
請注意,檢查開關時會顯示紋波。 下面的代碼不會改變紋波顏色。
public static void setSwitchColor(SwitchCompat v) {
// thumb color of your choice
int thumbColor = Color.RED;
// trackColor is the thumbColor with 30% transparency (77)
int trackColor = Color.argb(77, Color.red(thumbColor), Color.green(thumbColor), Color.blue(thumbColor));
// setting the thumb color
DrawableCompat.setTintList(v.getThumbDrawable(), new ColorStateList(
new int[][]{
new int[]{android.R.attr.state_checked},
new int[]{}
},
new int[]{
thumbColor,
Color.WHITE
}));
// setting the track color
DrawableCompat.setTintList(v.getTrackDrawable(), new ColorStateList(
new int[][]{
new int[]{android.R.attr.state_checked},
new int[]{}
},
new int[]{
trackColor,
Color.parseColor("#4D000000") // full black with 30% transparency (4D)
}));
}
如果你想要成本化軌道的顏色。你可以使用這個解決方案。
跟蹤selector.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/checked_color" android:state_checked="true" />
<item android:color="@color/checked_color" android:state_selected="true" />
<item android:color="@color/unchecked_color" android:state_checked="false" />
<item android:color="@color/unchecked_color" android:state_selected="false" />
其中checked_color和unchecked_color是您選擇的顏色。
styles.xml
<style name="mySwitchStyle" parent="@style/Widget.AppCompat.CompoundButton.Switch">
<!-- do here for additional costumization on thumb, track background,text appearance -->
</style>
<style name="mySwitchTheme" parent="ThemeOverlay.AppCompat.Light">
<item name="switchStyle">@style/mySwitchStyle</item>
<item name="colorControlActivated">@color/red</item>
<item name="colorControlNormal">@color/colorAccent</item>
<item name="trackTint">@color/track_selector</item>
</style>
布局文件
<android.support.v7.widget.SwitchCompat
android:theme="@style/mySwitchTheme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
Here is Switch Layout
-Adding theme to your switch to change the color of track.Check the style given below:-.
**Switch Compact**
<android.support.v7.widget.SwitchCompat
android:id="@+id/goOnlineBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:theme="@style/Switch_style/>
**Switch_style**
<style name="Switch_style" parent="Theme.AppCompat.Light">
<!-- active thumb & track color (30% transparency) -->
<item name="colorControlNormal">@android:color/white</item>
<item name="colorControlActivated">@android:color/blue</item>
<item name="colorSwitchThumbNormal">@android:color/white</item>
<item name="trackTint">@color/white</item>
</style>
trackTint將改變您的曲目顏色
如果您想在一個Activity中使用多種顏色的更多開關,則可以使用此解決方案(基於@Konifar的主題):
<style name="CustomSwitchTheme" parent="@style/ThemeOverlay.AppCompat.Dark.ActionBar">
<!-- Active thumb color & Active track color(30% transparency) -->
<item name="colorControlActivated">@color/custom</item>
<!-- Inactive thumb color -->
<item name="colorSwitchThumbNormal">#E0E0E0</item>
<!-- Inactive track color(30% transparency) -->
<item name="android:colorForeground">#757575</item>
</style>
其中@color/custom
是激活開關時的拇指顏色。
然后以這種方式將此主題應用於SwitchCompat:
<android.support.v7.widget.SwitchCompat
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:theme="@style/CustomSwitchTheme" />
我遇到了同樣的問題。 最后用這個Kotlin代碼以編程方式解決了它
fun tintSwitchButton(sw: SwitchCompat, resolvedColor: Int) {
val states = arrayOf(
intArrayOf(-android.R.attr.state_pressed),
intArrayOf(android.R.attr.state_pressed)
)
DrawableCompat.setTintList(sw?.trackDrawable, ColorStateList(
states,
intArrayOf(resolvedColor, resolvedColor)
))
DrawableCompat.setTintList(sw?.thumbDrawable, ColorStateList(
states,
intArrayOf(Color.WHITE, Color.WHITE)
))
}
函數調用是
tintSwitchButton(switchCompat, Color.rgb(214, 0, 0))
您還可以創建擴展功能:
fun SwitchCompat.tint(resolvedColor: Int) {
val states = arrayOf(
intArrayOf(-android.R.attr.state_pressed),
intArrayOf(android.R.attr.state_pressed)
)
DrawableCompat.setTintList(trackDrawable, ColorStateList(
states,
intArrayOf(resolvedColor, resolvedColor)
))
DrawableCompat.setTintList(thumbDrawable, ColorStateList(
states,
intArrayOf(Color.WHITE, Color.WHITE)
))
}
所以電話會更容易
switchCompat.tint(Color.rgb(214,0,0))
只需使用colorControlActivated來設置SwitchCompat的軌道和拇指的顏色。
如果未設置,則默認的colorControlActivated顏色將使用colorAccent。 (從經驗來看,仍未找到源代碼中的位置)。
源代碼發生了變化,但仍然不喜歡@Ovidiu說。 但仍然感謝他讓我知道從源代碼中找到答案。
mThumbDrawable = a.getDrawable(R.styleable.SwitchCompat_android_thumb);
最終將調用以下方法。
/frameworks/support/v7/appcompat/src/android/support/v7/widget/AppCompatDrawableManager.java
private ColorStateList createSwitchTrackColorStateList(Context context) {
final int[][] states = new int[3][];
final int[] colors = new int[3];
int i = 0;
// Disabled state
states[i] = ThemeUtils.DISABLED_STATE_SET;
colors[i] = getThemeAttrColor(context, android.R.attr.colorForeground, 0.1f);
i++;
states[i] = ThemeUtils.CHECKED_STATE_SET;
colors[i] = getThemeAttrColor(context, R.attr.colorControlActivated, 0.3f);
i++;
// Default enabled state
states[i] = ThemeUtils.EMPTY_STATE_SET;
colors[i] = getThemeAttrColor(context, android.R.attr.colorForeground, 0.3f);
i++;
return new ColorStateList(states, colors);
}
private ColorStateList createSwitchThumbColorStateList(Context context) {
final int[][] states = new int[3][];
final int[] colors = new int[3];
int i = 0;
final ColorStateList thumbColor = getThemeAttrColorStateList(context,
R.attr.colorSwitchThumbNormal);
if (thumbColor != null && thumbColor.isStateful()) {
// If colorSwitchThumbNormal is a valid ColorStateList, extract the default and
// disabled colors from it
// Disabled state
states[i] = ThemeUtils.DISABLED_STATE_SET;
colors[i] = thumbColor.getColorForState(states[i], 0);
i++;
states[i] = ThemeUtils.CHECKED_STATE_SET;
colors[i] = getThemeAttrColor(context, R.attr.colorControlActivated);
i++;
// Default enabled state
states[i] = ThemeUtils.EMPTY_STATE_SET;
colors[i] = thumbColor.getDefaultColor();
i++;
} else {
// Else we'll use an approximation using the default disabled alpha
// Disabled state
states[i] = ThemeUtils.DISABLED_STATE_SET;
colors[i] = getDisabledThemeAttrColor(context, R.attr.colorSwitchThumbNormal);
i++;
states[i] = ThemeUtils.CHECKED_STATE_SET;
colors[i] = getThemeAttrColor(context, R.attr.colorControlActivated);
i++;
// Default enabled state
states[i] = ThemeUtils.EMPTY_STATE_SET;
colors[i] = getThemeAttrColor(context, R.attr.colorSwitchThumbNormal);
i++;
}
return new ColorStateList(states, colors);
}
SwitchCompat是Material Design小部件。 當我的活動擴展AppCompatActivity和android:theme =“@ style / mySwitch”工作。
以下是開發人員如何更改SwitchCompat的軌道繪制:
首先,在根布局中,編寫xmlns:SwitchCompat="http://schemas.android.com/apk/res-auto"
然后:
<android.support.v7.widget.SwitchCompat
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:thumb="@drawable/your_switch_thumb"
SwitchCompat:track="@drawable/your_switch_track_selector"
/>
your_switch_track_selector可以是:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/switch_ios_track_on" android:state_checked="true" />
<item android:drawable="@drawable/switch_ios_track_off" android:state_checked="false" />
</selector>
1.switch_ios_track_on:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<solid android:color="#4EDA62" />
<corners android:radius="20dp" />
</shape>
2.switch_ios_track_off:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"
>
<solid android:color="#E3E3E3" />
<corners android:radius="20dp" />
</shape>
簡單易用..
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.