'How to make thumb smaller than track in switch button in android studio?

Hy, guys. This tiny problem drives me crazy. I wanted my switch to be like this :

enter image description here

, but after a lot of googling, I could not do it. My current button is this

enter image description here

Could you help me? Should I post my xml code?



Solution 1:[1]

unchecked checked

Here is my track.xml

<?xml version="1.0" encoding="utf-8"?>
<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="#FFFFFF"/>
            <corners android:radius="@dimen/_25sdp" />
            <size android:width="@dimen/_50sdp" android:height="@dimen/_25sdp" />
            <gradient
                android:startColor="@color/color_gradient_start"
                android:endColor="@color/color_gradient_end"/>
        </shape>
    </item>
    <item android:state_checked="false">
        <shape android:dither="true" android:shape="rectangle" android:useLevel="false" android:visible="true">
            <solid android:color="@color/color_background_button"/>
            <corners android:radius="@dimen/_25sdp" />
            <size android:width="@dimen/_50sdp" android:height="@dimen/_25sdp" />
        </shape>
    </item>
</selector>

Here is my thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item >
        <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false">

            <solid android:color="@color/transparent"/>
            <corners android:radius="@dimen/_16sdp"/>
            <size android:width="@dimen/_10sdp" android:height="@dimen/_25sdp"/>
        </shape>
    </item>
    <item android:top="@dimen/_5sdp" android:bottom="@dimen/_5sdp" android:start="@dimen/_8sdp" android:end="@dimen/_8sdp">
        <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false">

            <solid android:color="@color/white"/>
            <corners android:radius="@dimen/_16sdp"/>
            <size android:width="@dimen/_6sdp" android:height="@dimen/_18sdp"/>
        </shape>
    </item>
</layer-list>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Jack