HarmonyOS系统开发ArkTS常用组件切换按钮及参数

Toggle为切换按钮组件，一般用于两种状态之间的切换，例如下图中的蓝牙开关。

Toggle组件的参数：Toggle(options: { type: ToggleType, isOn?: boolean })

type属性用于设置Toggle组件的类型
isOn属性用于设置Toggle组件的状态
selectedColor()方法设置Toggle组件背景色
switchPointColor()方法设置Switch类型的Toggle组件中的圆形滑块颜色

可通过ToggleType枚举类型进行设置，可选的枚举值如下：

import promptAction from '@ohos.promptAction';@Entry
@Component
struct toggleTest {@State isOn: boolean = true;build() {Column({ space: 10 }) {Row({ space: 10 }) {Toggle({ type: ToggleType.Switch, isOn: false }).width(50).height(100)Toggle({ type: ToggleType.Switch, isOn: true }).width(50).height(100).selectedColor(Color.Green).switchPointColor(Color.Orange)}Row({ space: 10 }) {Toggle({ type: ToggleType.Checkbox, isOn: false }).width(50).height(100)Toggle({ type: ToggleType.Checkbox, isOn: true }).width(50).height(100)}Row({ space: 10 }) {Toggle({ type: ToggleType.Button, isOn: false }) {Text('关闭').fontSize(25).fontWeight(FontWeight.Bolder)}.width(100).height(50)// 默认是开启的Toggle({ type: ToggleType.Button, isOn: this.isOn }) {Text(this.isOn ? '开启' : '关闭').fontSize(25).fontWeight(FontWeight.Bolder)}.width(100).height(50).onChange((isOn) => {this.isOn = isOnconsole.log('isOn 是点击开启按钮自动传的值赋值给 this.isOn：', this.isOn);})}Text('点击开启按钮测试').fontSize(25)}.width('100%').height("100%").justifyContent(FlexAlign.Center)}
}

注意：switchPointColor()只有开关样式可以使用