如何正确缩放开关小部件的自定义拇指？

Question

我有一个来自可绘制对象的自定义拇指集，Switch用于LinearLayout. 我无法让它在各种屏幕上正确显示。在大多数屏幕上，它看起来像这样——

这很好，但在某些屏幕上（例如 - 440 dpi），它看起来像这样 -

如何使其在所有屏幕上看起来统一？我尝试了很多方法，包括switchMinWidth设置android:width=为 0dp、使用，thumbTextPadding但没有任何效果。一切都有完全相同的结果，它在某些屏幕上有效，但在其他屏幕上无效。

这是我Switch放置在 a 中的小部件，LinearLayout其中 a 为2。每个水平中通常layout_weight有5 个小部件，但这个特定的小部件有 4 个，因为应该占用 2 个插槽。LinearLayoutSwitch

        <Switch
            android:id="@+id/btndegreerad"
            style="?android:attr/borderlessButtonStyle"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="2"
            android:background="@drawable/degree_rad_track"
            android:showText="true"
            android:switchTextAppearance="@style/SwitchTextTheme"
            android:textAppearance="@style/TextAppearance.AppCompat.Body1"
            android:textOff="@string/btnrad"
            android:textOn="@string/btndegree"
            android:thumb="@drawable/degree_rad_thumb"
            android:thumbTextPadding="@dimen/_3sdp"
            android:thumbTint="@color/colorSwitch"
            android:track="@drawable/degree_rad_track" />

这是degree_rad_thumb可绘制的-

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false">
        <shape android:shape="rectangle">
            <size android:height="@dimen/_38sdp" android:width="0dp"/>
            <corners android:bottomRightRadius="10dp"
                android:bottomLeftRadius="10dp"
                android:topRightRadius="10dp"
                android:topLeftRadius="10dp"/>
        </shape>
    </item>
    <item android:state_checked="true">
        <shape android:shape="rectangle">
            <size android:height="@dimen/_38sdp" android:width="0dp"/>
            <corners android:bottomRightRadius="10dp"
                android:bottomLeftRadius="10dp"
                android:topRightRadius="10dp"
                android:topLeftRadius="10dp"/>
        </shape>
    </item>
</selector>

这也是degree_rad_track，尽管这可能不是必需的-

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorFadedPrimary"/>
            <corners android:bottomRightRadius="10dp"
                android:bottomLeftRadius="10dp"
                android:topRightRadius="10dp"
                android:topLeftRadius="10dp"/>
        </shape>
    </item>
    <item android:state_checked="true">
        <shape android:shape="rectangle">
            <solid android:color="@color/colorFadedPrimary"/>
            <corners android:bottomRightRadius="10dp"
                android:bottomLeftRadius="10dp"
                android:topRightRadius="10dp"
                android:topLeftRadius="10dp"/>
        </shape>
    </item>
</selector>

Answer 1

如果您想正确缩放到任何东西上的所有屏幕；我最好的规则是一般使用 ScrollView 和relativelayout/constraintlayout，这样它就可用并且可以缩放。

您可以在ConstraintLayout和RelativeLayout之间进行选择；两者都应该正确缩放，也许相对更容易，因为您不必设置约束。这里不一定需要 ScrollView，因为我们没有很多数据。

尝试将您的 Switch 放入相对布局/约束布局中，它应该可以工作。

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <RelativeLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <Switch
                    android:id="@+id/btndegreerad"
                    style="?android:attr/borderlessButtonStyle"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="2"
                    android:background="@drawable/degree_rad_track"
                    android:showText="true"
                    android:switchTextAppearance="@style/SwitchTextTheme"
                    android:textAppearance="@style/TextAppearance.AppCompat.Body1"
                    android:textOff="@string/btnrad"
                    android:textOn="@string/btndegree"
                    android:thumb="@drawable/degree_rad_thumb"
                    android:thumbTextPadding="@dimen/_3sdp"
                    android:thumbTint="@color/colorSwitch"
                    android:track="@drawable/degree_rad_track" />

            </RelativeLayout>

        </LinearLayout>

注意：根据需要自定义布局

希望能帮助到你。