0

Currently I am using Android Studio Flamingo version 2022.2.1 Patch 2, using Android 33 emulator.

I'm trying to create a simple custom Switch, for that I needed to create a total of 4 XML files:

thumb.xml

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

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:shape="rectangle">
            <solid
                android:color="@color/darkGray" />
            <size
                android:height="8dp" />
            <corners
                android:radius="100dp" />
        </shape>
    </item>
    <item android:state_checked="false">
        <shape
            android:shape="rectangle">
            <solid
                android:color="@color/lavender" />
            <size
                android:height="8dp" />
            <corners
                android:radius="100dp" />
        </shape>
    </item>
</selector>

thumbfalse.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="oval">
            <solid
                android:color="@color/white" />
            <size
                android:height="8dp"
                android:width="8dp" />
            <stroke
                android:width="1dp"
                android:color="@color/lavender" />
        </shape>
    </item>
    <item
        android:drawable="@drawable/baseline_wb_sunny_24"
        android:top="8dp"
        android:bottom="8dp"
        android:right="8dp"
        android:left="8dp" />
</layer-list>

thumbtrue.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="oval">
            <solid
                android:color="@color/white" />
            <size
                android:height="8dp"
                android:width="8dp" />
            <stroke
                android:width="1dp"
                android:color="@color/darkGray" />
        </shape>
    </item>
    <item
        android:drawable="@drawable/baseline_nightlight_round_24"
        android:top="8dp"
        android:bottom="8dp"
        android:right="8dp"
        android:left="8dp" />
</layer-list>

According to the tutorials I found on the internet, these settings are more than enough to create a custom switch.

Finally, I modified the Switch Compact's track and thumb properties in the main file:

main_activity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <androidx.appcompat.widget.SwitchCompat
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/switchMode"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="30dp"
        app:thumb="@drawable/thumb"
        app:track="@drawable/track"
        />
</LinearLayout>

I try to use android:thumb and android:track, but the layout of my Switch don't change and it remains by default in both Android Studio and the emulator.

How can I solve this?

UPDATE

I can solve this problem change the element <androidx.appcompat.widget.SwitchCompat> to <Switch>, like this:

<Switch
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/switchMode"
        android:layout_marginTop="10dp"
        android:layout_marginEnd="30dp"
        android:thumb="@drawable/thumb"
        android:track="@drawable/track"
        />

The problem is the element will be deprecated and it is discouraged to be used.

SOLUTION

In my themes.xml files I was using a Material3 template that override my custom switch layout by default.

To solve this problem I change this:

parent="Theme.Material3.DayNight.NoActionBar"

To this:

parent="Theme.AppCompat.DayNight.NoActionBar"

Now my themes execute every custom layout I create.

Sudo Sur
  • 385
  • 4
  • 17

0 Answers0