安卓自定义开关

Question

我正在尝试制作这样的自定义开关：

具有这些特性：

1. 始终显示两侧的文本。
2. 不同颜色的开和关。

这是我面临的两个问题，因为开关只显示所选一侧的文本，而且我似乎找不到可以指定两种不同颜色的地方？

我可以使用 android studio 中的常规开关来实现这一点，还是必须使用一些库？

谢谢你。

Answer 1

经过研究，我找到了一种方法，可以完全满足我的需要，这就是我得到的：

如果有人正在寻找一种方法来做到这一点，方法如下：

基于this post answer，这对我很有用。

这就是我所做的，我创建了两个可绘制对象，一个用于 On ，另一个用于 Off ：

switch_on.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:state_checked="true" android:drawable="@color/colorGray"/>
    <item android:drawable="@color/colorPrimary" android:state_checked="true" />
    <item android:drawable="@color/colorPrimaryDark" android:state_pressed="true" />
    <item android:drawable="@color/transparent" />

</selector>

switch_off.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_enabled="false" android:state_checked="true" android:drawable="@color/colorGray"/>
    <item android:drawable="@color/gray_light" android:state_checked="true" />
    <item android:drawable="@color/black_overlay" android:state_pressed="true" />
    <item android:drawable="@color/transparent" />
</selector>

接下来，为开关的轮廓创建了一个drawable。 大纲.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="2dp" />
    <solid android:color="#80ffffff" />
    <stroke
        android:width="1dp"
        android:color="@color/gray_light" />
</shape>

我添加的一件事是文本颜色的可绘制对象，因为文本的颜色会根据是否选中而改变，就是这样： switch_text.xml

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

最后，RadioGroup以这种方式在我的布局中创建：

<RadioGroup
        android:id="@+id/toggle"
        android:layout_width="wrap_content"
        android:layout_height="50dp"
        android:background="@drawable/outline"
        android:checkedButton="@+id/off"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/off"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginBottom="1dp"
            android:layout_marginStart="1dp"
            android:layout_marginTop="1dp"
            android:layout_weight="1"
            android:background="@drawable/switch_off"
            android:button="@null"
            android:gravity="center"
            android:padding="@dimen/fab_margin"
            android:text="@string/off"
            android:textColor="@drawable/switch_text" />

        <RadioButton
            android:id="@+id/on"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_marginBottom="1dp"
            android:layout_marginEnd="1dp"
            android:layout_marginTop="1dp"
            android:layout_weight="1"
            android:background="@drawable/switch_on"
            android:button="@null"
            android:gravity="center"
            android:padding="@dimen/fab_margin"
            android:text="@string/on"
            android:textColor="@drawable/switch_text" />
    </RadioGroup>

注意每个 drawable 在正确位置的用法：

android:background="@drawable/outline"为RadioGroup中 android:background="@drawable/switch_off"用于第一单选按钮 android:background="@drawable/switch_on"用于第二单选按钮 android:textColor="@drawable/switch_text"两个单选按钮

就这样。