SLIDE_SWITCH

用于在打开和关闭状态之间进行切换。
创建 UI 控件
const slideSwitch = hmUI.createWidget(hmUI.widget.SLIDE_SWITCH, Param)
类型
Param: object
| 属性 | 说明 | 是否必须 | 类型 |
|---|---|---|---|
| x | 控件 x 坐标 | 是 | number |
| y | 控件 y 坐标 | 是 | number |
| w | 控件显示宽度 | 是 | number |
| h | 控件显示高度 | 是 | number |
| select_bg | 控件选中状态的背景图片路径 | 是 | string |
| un_select_bg | 控件未选中状态的背景图片路径 | 是 | string |
| slide_src | 控件开关按钮图片路径 | 是 | string |
| slide_select_x | 开关按钮选中状态的 x 坐标,相对于控件的坐标 | 是 | number |
| slide_un_select_x | 开关按钮未选中状态的 x 坐标 相对于控件的坐标 | 是 | number |
| slide_y | 开关按钮 y 轴坐标偏移,相对于控件的坐标 | 否 | number |
| checked_change_func | 控件状态更改时的回调函数 | 否 | CheckedChangeFunc |
| checked | 默认选中状态 | 否 | boolean |
CheckedChangeFunc: function
(slideSwitch: SlideSwitch, checked: boolean) => void
| 参数 | 说明 | 类型 |
|---|---|---|
| slideSwitch | slideSwitch 实例 | SlideSwitch |
| checked | 是否选中 | boolean |
Prop 属性
| 属性 | 说明 | 类型 |
|---|---|---|
hmUI.prop.CHECKED | 设置开关状态 获取开关状态 | boolean |
代码示例
提示
代码示例中的图片资源请参考 设计资源
Page({
build() {
const slide_switch = hmUI.createWidget(hmUI.widget.SLIDE_SWITCH, {
x: 200,
y: 200,
w: 96,
h: 64,
select_bg: 'switch_on.png',
un_select_bg: 'switch_off.png',
slide_src: 'radio_select.png',
slide_select_x: 40,
slide_un_select_x: 8,
checked: true,
checked_change_func: (slideSwitch, checked) => {
console.log('checked', checked)
}
})
console.log('slide checked', slide_switch.getProperty(hmUI.prop.CHECKED))
}
})