1.首先创建三个layer
Bg:用于接收按钮事件和进度条显示控制
Button:按钮开关
Progress:进度条
创建两个自定义属性然后将两个属性拖动到BG的Customization下
switchOn:用于控制开关的显示和隐藏
BAR:用于控制进度条的宽度
3.在Button的layer下添加两个Button按钮并添加图片
4.选中button(on),在Interaction窗口下点击新建clicked事件并且绑定Bg下新建的两个属性
5.选中Button下的on控件的Visible属性,将属性绑定在Bg下的switchOn属性
6.再选中Progress下的Fill控件的width属性,将属性绑定在Bg下的BAR属性,选中Behavior填写以下属性。
同理关闭按钮将以上的操作重复一次
仅需五步就实现了开关的切换和开关控制进度条两个功能,是不是很简单。