Question

我正在尝试创建一个自定义切换按钮，其大拇指约占其轨道的75％（宽度）。我不想使用图像，只是可绘制的形状，样式等。到目前为止，我已经完成了以下工作：

activity_main.xml中

<Switch
        android:id="@+id/onOffSwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:track="@drawable/switch_custom_track"
        android:thumb="@drawable/switch_custom_thumb"
        android:showText="true"
        android:textOff="Off"
        android:textOn="On"/>

switch_custom_track.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/switch_custom_track_on" />
    <item android:state_checked="false" android:drawable="@drawable/switch_custom_track_off" />
</selector>

switch_custom_track_on.xml

<shape
    android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="20dp" />
    <solid android:color="#00b800" />
    <size android:width="90dp" android:height="40dp" />
</shape>

switch_custom_track_off.xml

<shape
    android:shape="rectangle"
    xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="20dp" />
    <solid android:color="#fd491d" />
    <size android:width="90dp" android:height="40dp" />
</shape>

switch_custom_thumb.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:drawable="@drawable/switch_custom_thumb_on" />
    <item android:state_checked="false" android:drawable="@drawable/switch_custom_thumb_off" />
</selector>

switch_custom_thumb_on.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <corners android:radius="20dp" />
    <solid android:color="#ffffff" />
    <size android:width="70dp" android:height="40dp" />
    <stroke android:width="2dp" android:color="#00b800" />
</shape>

switch_custom_thumb_off.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <corners android:radius="20dp" />
    <solid android:color="#ffffff" />
    <size android:width="70dp" android:height="40dp" />
    <stroke android:width="2dp" android:color="#fd491d" />
</shape>

使用上面的代码我得到了这个：

https://d1ro8r1rbfn3jf.cloudfront.net/ms_28780/buq3SAmnkEvOTUgRwZsQ7ZKGn5V7U8/switch.png?Expires=1423585499&Signature=GtuSi6G1WwUefvgsDfgPOWEmoe3I93Jm0R-Cyxkm~pgoQkJlf53UCxKJX~m7rs1KahuP9PMdr9N2ht0KjVL0P~rIzvbieEO0~2bjaITq2z2SnNu9TAlGaTJEy~InuS1EcCH~OAkoJPSuZ0IYjq0LwOQBxC9awdgypL~IKGF4GILUfknk~n0ZjC2TzW2ovdbyR8JjX48Pg7Xey82I8oBpwvlRfxGigiGfNDEw36Dqk~Q1dzK5k9IO0ERk~c2m7K~ZdZ78oXvGx8-EGruYCxfJIe5b0PeHqG~bV1fK9sv1cqRebXWIOJbZS6EZf6BUPIuZ0OO9xQbUXTLrARV55cD6nQ__&Key-Pair-Id=APKAJHEJJBIZWFB73RSA

所以拇指的宽度是轨道的50％。请注意“switch_custom_track_off.xml”中size元素的“90dp”宽度和“switch_custom_thumb_off.xml”中size元素的宽度“70dp”。我预计拇指（到赛道）的相对大小应为70dp / 90dp = 77％。然而，清晰可见的是，轨道扩展到拇指大小的两倍。

那么可以制作一个“完全自定义”尺寸的拇指和轨道吗？如果是的话，你能帮助我达到预期的效果吗？

Android：自定义开关：如何在不使用图像的情况下使拇指超过50％的轨道

0 个答案: