「这是我参与11月更文挑战的第2天,活动详情查看:2021最后一次更文挑战」
Android 使用SwitchButton
这几天工作不忙,自己封装了一个开关切换按钮,简单的使用没有问题,但在RecyclerView列表中发现了一个神奇的现象,我这个开关按钮滑动的时候,居然会出现不开不关的状态,就是按钮在中间,既不在左边,也不在右边。 还是算了,去用轮子吧,毕竟咱只是搬砖的...
需求
- 可以点击时进行左右切换
- 可以设置文字
- 可以设置不可点击状态
- 可以设置按钮背景色
- 可以设置按钮图标的背景色
- 可以通过设置进行更改
- 可以通过接口回调监听按钮的状态
选轮子
下载了几个demo的安装文件,最终选择使用下面这个库,因为它的类也并不大,但是功能很全,无论是自定义属性,还是代码中进行设置更改。默认的配置可以满足大部分的场景,且拥有可配置的地方也相当丰富。
进入首页发现它有一些更新:
- 重新明确了参数的含义。
- 更新了SwitchButton的测量机制,逻辑更加清晰;尤其是文字部分。
- 支持设置确定的宽高,来确定SwitchButton的View大小。现在有两种方式可以控制SwitchButton的大小了。
- 可滚动的View中的SwitchButton只会消费横向滚动事件。这意味着你可以从SwitchButton开始按下并纵向滚动可滚动View,SwitchButton现在不会阻止你滚动了。
- Bug 修复。
看来滑动的问题大家也都会遇到。
用轮子满足需求
使用库之后也让需求变得如此简单。
- 将库引入到项目
implementation 'com.kyleduo.switchbutton:library:2.1.0'
- 布局文件,自定义View
<com.kyleduo.switchbutton.SwitchButton
android:id="@+id/sb_text"
style="@style/SwitchButtonStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:textSize="16dp"
app:kswBackColor="#720900"
app:kswTextAdjust="-2dp"
app:kswTextExtra="8dp"
app:kswTextOff="反"
app:kswTextOn="正"
app:kswThumbColor="#FFFFFF" />
其中属性对应的是:
kswBackColor : 整个按钮的背景色
kswThumbColor : 开关按钮圆形的背景色
kswTextOn:打开时显示的文字
kswTextOff:关闭时显示的文字
textColor:文字颜色
- 代码文件
SwitchButton switchButton = findViewById(R.id.sb_text);
switchButton.setChecked(true);
switchButton.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
Log.d("===", "isChecked:" + isChecked);
}
});
setChecked 属性即可设置是否可用。
如果想正反面的颜色不同,那么就需要引入kswBackDrawable
属性。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_enabled="false" android:state_checked="true">
<shape>
<solid android:color="#b3ecbc"/>
<corners android:radius="99dp"/>
</shape>
</item>
<item android:state_enabled="false" android:state_checked="false">
<shape>
<solid android:color="#FEFEFE"/>
<corners android:radius="99dp"/>
<stroke
android:width="1.5dp"
android:color="#F0F0F0"/>
</shape>
</item>
<item android:state_checked="true">
<shape>
<solid android:color="#43d95d"/>
<corners android:radius="99dp"/>
</shape>
</item>
<item>
<shape>
<solid android:color="#ff0000"/>
<corners android:radius="99dp"/>
<stroke
android:width="1.5dp"
android:color="#E6E6E6"/>
</shape>
</item>
</selector>