Android自定义控件实现简单滑动开关效果
作者：Jack-Chan 发布时间：2022-09-07 16:46:01
标签：Android,滑动开关
本文实例为大家分享了Android自定义控件实现简单滑动开关的具体代码，供大家参考，具体内容如下
ToggleButton 滑动开关
项目概述
滑动开关是一个纯粹的自定义控件，上面的按钮会随着我们的左右滑动而滑动，并且在状态改变时通知用户，效果如下图1-9 所示，这也是应用中设置某些状态信息时最常见的控件，因此，我们有必要学习关于如何
自定义一个这样的滑动开关。
滑动开关UI
布局文件为activity_main.xml，代码如下：res/layout/activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:itheima="http://schemas.android.com/apk/res/com.itheima.togglebuttondemo"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.itheima.togglebuttondemo.view.ToggleButton
android:id="@+id/togglebutton"
android:layout_width="wrap_content"
android:layout_centerInParent="true"
itheima:SwitchBtnBackgroud="@drawable/switch_background"
itheima:SlidBtnBackgroud="@drawable/slide_button_background"
itheima:CurrentState="false"
android:layout_height="wrap_content"/>
</RelativeLayout>
在activity_main.xml 布局中引入如下命名空间：
xmlns:itheima=”http://schemas.android.com/apk/res/com.itheima.togglebuttondemo”,com.itheima.togglebuttondemo 是包名，itheima 是自定义的命名控件名，可以任取名字，也可以使用类名。
上面的布局主要是引入com.itheima.togglebuttondemo.view.ToggleButton 类和自定义属性的使用。添加自定义属性，在values 目录下创建attrs.xml 文件，具体代码如文件所示：
res/values/attrs.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="ToggleButton">
<!-- 滑动开关背景图片属性-->
<attr
name="SwitchBtnBackgroud"
format="reference"/>
<!-- 滑动块背景图片属性-->
<attr
name="SlidBtnBackgroud"
format="reference"/>
<!-- 滑动开关的状态-->
<attr
name="CurrentState"
format="boolean"/>
</declare-styleable>
</resources>
attrs.xml 文件目录结构如下图所示：
滑动开关业务逻辑实现
下拉选择框activity 界面，MainActivity.java 代码如下：com/itheima/MySwitch/MainActivity
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ToggleButton togglebutton = (ToggleButton) findViewById(R.id.togglebutton);
//设置滑动开关的背景图片
// togglebutton.setSwitchBtnBackgroudResource(R.drawable.switch_background);
//设置滑动块的背景图片
// togglebutton.setSlidBtnBackgroudResource(R.drawable.slide_button_background);
//设置滑动开关的默认状态
// togglebutton.setCurrentState(true);
//设置滑动开关状态改变监听
Togglebutton.setToggleBtnStateChangeListener(new ToggleBtnStateChangeListener() {
@Override
public void onToggleBtnStateChange(boolean currentState) {
if (currentState) {
Toast.makeText(getApplicationContext(), "开关打开", 0).show();
}else{
Toast.makeText(getApplicationContext(), "开关关闭", 0).show();
}
}
});
}
}
自定义的滑动开关ToggleButton 类的实现，具体代码如文件所示：com/itheima/MySwitch/MainActivity
public class ToggleButton extends View {
private Bitmap switchBitmap;//滑动开关的背景图片
private Bitmap slidBitmap;//滑动块的背景图片
private boolean currentState;
private int currentX;//手指触摸点的X 值
private boolean isTouching = false;
private ToggleBtnStateChangeListener mToggleBtnStateChangeListener;//状态改变 *
//在xml 中引用该控件时，调用该方法
public ToggleButton(Context context, AttributeSet attrs) {
super(context, attrs);
String namespace = "http://schemas.android.com/apk/res/com.itheima.togglebuttondemo";
currentState = attrs.getAttributeBooleanValue(namespace, "CurrentState", false);
int switchBtnBackgroudId =
attrs.getAttributeResourceValue(namespace, "SwitchBtnBackgroud", -1);
int slidBtnBackgroudId =
attrs.getAttributeResourceValue(namespace, "SlidBtnBackgroud", -1);
setSwitchBtnBackgroudResource(switchBtnBackgroudId);
setSlidBtnBackgroudResource(slidBtnBackgroudId);
}
//在代码中创建该控件时，调用该构造方法
public ToggleButton(Context context) {
super(context);
}
//设置滑动开关的背景图片
public void setSwitchBtnBackgroudResource(int switchBackground) {
switchBitmap = BitmapFactory.decodeResource(getResources(), switchBackground);
}
// 为了可以高度自定义和增强可扩展性，我们可以给其创建一个自定义控件底部背景了一个方法
// 设置滑动块的背景图片
public void setSlidBtnBackgroudResource(int slideButtonBackground) {
slidBitmap = BitmapFactory.decodeResource(getResources(), slideButtonBackground);
}
//设置滑动开关的默认状态
public void setCurrentState(boolean b) {
currentState = b;
}
// 1、测量滑动开关的宽高
// 测量控件的宽高
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension(switchBitmap.getWidth(), switchBitmap.getHeight());
}
// 2、绘制，画出我们的滑动开关
//canvas:画布，将图形绘制在canvas，才能显示到屏幕上
@Override
protected void onDraw(Canvas canvas) {
//绘制滑动开关的背景图片
canvas.drawBitmap(switchBitmap, 0, 0, null);
//绘制滑动块的背景图片
if(isTouching){//手指触摸的时候，根据currentx 的值来绘制滑动块
//根据手指的X 值，来绘制滑动块图片
int left = currentX - slidBitmap.getWidth()/2;
if(left < 0){//设置左边界
left = 0;
}else if(left > (switchBitmap.getWidth() - slidBitmap.getWidth())){//设置右边界
left = switchBitmap.getWidth() - slidBitmap.getWidth();
}
canvas.drawBitmap(slidBitmap, left, 0, null);
}else{ // 手指离开控件的时候，根据状态来绘制滑动块
// 根据状态值，来绘制滑动块
if(currentState){ //当前为true，开关打开，滑动块显示在最右边
canvas.drawBitmap(slidBitmap,switchBitmap.getWidth() - slidBitmap.getWidth(),
0, null);
}else{//当前为false，开关关闭，滑动块显示在最左边
canvas.drawBitmap(slidBitmap, 0, 0, null);
}
}
}
//当控件被触摸后，会调用该方法
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN://手指按下
isTouching = true;
currentX = (int) event.getX();
break;
case MotionEvent.ACTION_MOVE://手指滑动
isTouching= true;
currentX = (int) event.getX();
break;
case MotionEvent.ACTION_UP://手指抬起
isTouching = false;
currentX = (int) event.getX();
int center = switchBitmap.getWidth()/2;
//当滑动块中心点大于滑动开关背景图片的中心线时，显示到右边，当前状态为true
boolean state = currentState;
currentState = currentX > center;
if(mToggleBtnStateChangeListener !=null&&state != currentState ){
mToggleBtnStateChangeListener.onToggleBtnStateChange(currentState);
}
break;
default:
break;
}
invalidate(); //强制让控件重新绘制，ondraw；
return true; //自己处理触摸事件
}
public void setToggleBtnStateChangeListener(ToggleBtnStateChangeListenerlistener){
this.mToggleBtnStateChangeListener = listener;
}
// 定义滑动开关状态改变的回调接口
public interface ToggleBtnStateChangeListener{
void onToggleBtnStateChange(boolean currentState);
}
}
运行程序，效果图如图1-11 所示。
知识点总结
1．通过setMeasuredDimension 方法，来设置自定义控件的宽高，见ToggleButton 类第42 行
2．View 可以通过invalidate()方法强制让自己重新绘制，见ToggleButton 类第96 行
3．View 通过实现onTouchEvent 方法来处理手指触摸事件，见ToggleButton 类第72 行
自定义控件之自定义属性
当我们使用自定义属性来自定义控件时，一般分为以下几个步骤进行设置：
1、在res 文件的values 里面创建attrs.xml，见文件【1-10】attrs.xml
2、在attrs.xml，里面定义我们需要的属性，见文件【1-10】attrs.xml 代码
3、在布局文件中使用自定义的属性，注意要添加命名空间，见文件【1-9】activity_main.xml 第2 行
4、在构造方法中来获取设置的属性数据，见文件【1-9】见ToggleButton 类第8~19 行
来源：https://blog.csdn.net/axi295309066/article/details/55669319
0
投稿猜你喜欢
- 项目中有需要多次统计 某些集合中 的某个属性值，所以考虑封装一个方法，让其其定义实现计算方式。 话不多说，看代码：1、封装的自定义集合工具类
一、概述在自定义ViewGroup中，很多效果都包含用户手指去拖动其内部的某个View(eg:侧滑菜单等)，针对具体的需要去写好onInte- 需求：android存储字符串数据简单的有SharePerfence不过只能存储89kb最多的数据（好像），超过这个数据如果不方便网络存储，
- 自定义View是绘制文本有三类方法// 第一类public void drawText (String text, float x, flo
- springboot结合maven配置不同环境的profile1、在spring-boot中新建配置文件spring-boot不同环境配置文
- 要“监听”事件，我们总是可以将“ * ”作为事件源中的另一个方法写入事件，但这将使事件源与 * 的逻辑紧密耦合。对于实际事件，我们比直接方法
- 如果没有安装过maven，是用的idea自带的maven，那就是idea的安装目录下 /plugins/maven/lib/maven3这个
- 在 Android 的一些界面中，有时候我们需要为一副图片生成大小为 n * n 的缩略图，有时候需要的缩略图特殊一些，比如：1、带圆角的缩
- IDEA快速创建getter和setter方法找到generate我的是Mac，右击鼠标就可以打开，相信windows也不难。选择gette
- 本文实例讲述了Android实现Activity、Service与Broadcaster三大组件之间互相调用的方法。分享给大家供大家参考，具
- 项目中有个要求，对上传服务器的图片大小进行判断，大于500k的图片要进行压缩处理，让其小于500k后在上传。可以通过java api的Ima
- 本文实例为大家分享了AndroidStudio简单实现BMI计算的具体代码，供大家参考，具体内容如下xml代码```xml<TextV
- 第一：写Cookies Response.Cookies["UserName"].Value="Guest&q
- 1.预警需求为了更好的管理商品日期，需要对仓库的商品进行预警管理，对商品的保质期控制在一个范围内提示出来，也可以通过该功能间接的展示出一个商
- 本文实例讲述了C#遍历操作系统下所有驱动器的方法。分享给大家供大家参考。具体分析如下：这里先通过DriveInfo类的GetDrivers方
- 1、SerialPortHelper「Android串口通信」介绍原项目地址https://github.com/freyskill/Ser
- 前言定时器线程池提供了定时执行任务的能力，即可以延迟执行，可以周期性执行。但定时器线程池也还是线程池，最底层实现还是ThreadPoolEx
- 一：问题引入前面讲到用户支付完成之后微信支付服务器会发送回调通知给商户，商户要能够正常处理这个回调通知并返回正确的状态码给微信支付后台服务器
- 一、Drools引擎简介1、基础简介Drools是一个基于java的规则引擎，开源的，可以将复杂多变的规则从硬编码中解放出来，以规则脚本的形
- 关联篇：深入Android的消息机制源码详解－Handler,MessageQueue与Looper关系关联篇：Handler内存泄漏及其
