Android Switch开关和SeekBar进度条常用精简配置

目录

一、Switch/SwitchCompat

layout的xml文件代码

bg_sw_thumb.xml

bg_sw_track.xml

开关效果

二、SeekBar 

layout的xml文件代码

sb_thumb.xml

bg_sb_track.xml

进度条效果

---

一、Switch/SwitchCompat

1、Switch在开关状态改变时会震动，而SwitchCompat没有。

2、自定义thumb属性时要设置check为true和false的两种状态，如果未设置有可能导致组件不显示。

layout的xml文件代码

        <androidx.appcompat.widget.SwitchCompat
                android:id="@+id/sw"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:thumb="@drawable/bg_sw_thumb"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:track="@drawable/bg_sw_track" />

bg_sw_thumb.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="oval">
            <!--设置圆的半径-->
            <size android:width="20dp" android:height="20dp" />

            <!--设置圆空心部分的背景色 -->
            <solid android:color="#F0F0F0" />

            <!--设置圆边的背景色-->
            <stroke android:width="1dp" android:color="#052DFF" />
        </shape>
    </item>
    <item>
        <shape android:shape="oval">
            <!--设置圆的半径-->
            <size android:width="20dp" android:height="20dp" />

            <!--设置圆空心部分的背景色 -->
            <solid android:color="#e6e6e6" />

            <!--设置圆边的背景色-->
            <stroke android:width="1dp" android:color="#CCCECC" />
        </shape>
    </item>
</selector>

bg_sw_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">
            <!--设置圆角矩形的圆角半径-->
            <corners android:radius="25dp"/>
            <solid android:color="#052DFF"/>
            <!--设置圆边的背景色-->
            <stroke
                android:width="1dp"
                android:color="#052DFF"/>
        </shape>
    </item>
    <item>
        <shape android:shape="rectangle">
            <!--设置圆角矩形的圆角半径-->
            <corners android:radius="25dp"/>
            <solid android:color="#666666"/>
            <!--设置圆边的背景色-->
            <stroke
                android:width="1dp"
                android:color="#666666"/>
        </shape>
    </item>
</selector>

开关效果

二、SeekBar 

1、通过设置maxHeight和minHeight属性控制进度条的真正高度。

2、splitTrack属性用来设置滑块与进度条是否有融合（有无边距）。

3、thumbOffset属性用来设置滑块与进度条左右顶点的间距。

4、progressDrawable属性设置进度条背景。

layout的xml文件代码

            <SeekBar
                android:id="@+id/sb"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:maxHeight="8dp"
                android:minHeight="8dp"
                android:progressDrawable="@drawable/bg_sb_track"
                android:splitTrack="false"
                android:thumb="@drawable/sb_thumb"/>

sb_thumb.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/white" />
    <corners android:radius="3dp" />
    <!--滑块大小-->
    <size
        android:width="15dp"
        android:height="15dp" />
</shape>

bg_sb_track.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--未滑动的进度条背景-->
    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dp" />
            <solid android:color="#DCDCDC" />
        </shape>
    </item>
    <!--滑动的进度条背景-->
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <corners android:radius="5dp" />
                <solid android:color="#052DFF" />
            </shape>
        </clip>
    </item>
</layer-list>

进度条效果