如图所示的开关列表

时间:2019-01-24 10:22:50

标签: java android android-layout

我正在开发一个android软件,并且在设置部分中需要相同的确切设计。 我已自定义开关,但无法达到相同的结果。

这是我的代码:

settings_Activity:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:layout_gravity="center"
    android:gravity="center">

    <Switch
        android:id="@+id/switch2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:checked="true"
        android:text="Econet Mode"
        android:track="@drawable/switch_track"
        android:thumb="@drawable/swithc_thumb"
        />

</LinearLayout>

switch_thumb:

         

<stroke android:width="4dp" android:color="@android:color/transparent"/>

switch_track:

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<shape android:shape="rectangle">
    <corners android:radius="20dp"></corners>
    <solid android:color="@color/colorPrimary"></solid>
</shape>

<item android:state_checked="false">

    <shape android:shape="rectangle">
        <corners android:radius="20dp"></corners>
        <solid android:color="@color/colorGrey"></solid>
    </shape>
</item>

这是我想要看到的最终结果:

Expected result

1 个答案:

答案 0 :(得分:0)

创建可绘制的 thumb_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">
            <solid android:color="#ffffff" />
            <corners android:radius="100dp" />
            <size android:width="24dp" android:height="25dp" />
            <stroke android:width="4dp" android:color="#0000ffff" />
        </shape>
    </item>
</selector>

创建可绘制的 track_selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">
            <solid android:color="@color/text_pink" />
            <corners android:radius="25dp" />
            <size android:width="2dp" android:height="18dp" />
        </shape>
    </item>
    <item android:state_checked="false">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">

            <corners android:radius="25dp" />
            <size android:width="2dp" android:height="18dp" />
            <stroke
                android:width="2dp"
                android:color="@color/white" />
        </shape>
    </item>
</selector>

像这样使用它

<android.support.v7.widget.SwitchCompat
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:checked="true"
                    android:padding="5dp"
                    android:thumb="@drawable/thumb_selector"
                    app:track="@drawable/track_selector" />