自定义 Android SwitchCompat

Question

在我的 Android 应用程序中，我有一个带有 SwitchCompat 的列表来过滤列表数据。默认主题不能满足我的目的，我需要的是 iOS 之类的开关。我不知道如何自定义它以使其看起来与 iOS 开关完全一样。感谢阅读。

            <androidx.appcompat.widget.SwitchCompat
                android:id="@+id/switch_1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:background="@xml/custom_switch_background_main"
                android:theme="@style/AppTheme.SwitchOverlay"/>

这是我目前存档的内容

custom_switch_background_main.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false" android:drawable="@xml/custom_switch_background"  />
    <item android:state_checked="true" android:drawable="@xml/custom_switch_background"  />
</selector>

custom_switch_background.xml

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

这就是我想要的

Answer 1

我认为您应该使用滑动标签布局而不是 switchcompat 来满足您的要求。我找到了一个第三方库，它看起来和你想要的一样。

Click Here to Use This Library

Answer 2

您可以实现类似的目标：

与标准MaterialButtonToggleGroup:

      <com.google.android.material.button.MaterialButtonToggleGroup
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           app:selectionRequired="true"
           app:singleSelection="true">
           
           <com.google.android.material.button.MaterialButton
               app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.rounded"
               style="?attr/materialButtonOutlinedStyle"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="ITEM1"/>

           <com.google.android.material.button.MaterialButton
               app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.rounded"
               style="?attr/materialButtonOutlinedStyle"
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="ITEM2"/>
           
           
       </com.google.android.material.button.MaterialButtonToggleGroup>

与：

<style name="ShapeAppearanceOverlay.App.rounded" parent="">
    <item name="cornerSize">50%</item>
</style>

如果你想要边框，你可以将 MaterialButtonToggleGroup 包裹在一个容器中（LinearLayout，CardView...）应用一个小填充的笔触。

如果你想要两边都有圆角的按钮，你可以检查类似。

Answer 3

我通过使用自定义矢量（里面的文本是一个掩码）来实现设计，它替代了开关的状态指示器。然后我也用自定义边框设计更改了 switch compat 背景矢量以实现边框。我会尽快再次更新此答案。

自定义 Android SwitchCompat

Customise Android SwitchCompat

android

android-layout

android-button

android-switch

material-components-android