Radio

效果

子组件

无

参数

value

自己的值

group

几个 Radio 共同组成一个组，组内只能有一个被选中

属性

checked

反显数据的时候用 选中就是 true，不选中就是 false

radioStyle

自定义样式

• checkedBackgroundColor 底版颜色

• indicatorColor 钩子颜色

• uncheckedBorderColor 没选中的时候 描边颜色

事件

onChange

 .onChange((isChecked: boolean) => {
     console.log('Radio1 status is ' + isChecked)
})

示例

@Entry
@Component
struct Index9 {
    @State message: string = 'Hello World';

    build() {
        Column(){
          Row(){
            Text('Radio1').fontSize(24)
            Radio({ value: 'Radio1', group: 'radioGroup' }).checked(true)
              .radioStyle({
                  // 底版颜色
                checkedBackgroundColor: Color.Blue,
                  // 钩子颜色
                  indicatorColor:Color.Red,
                  // 没选中的时候 描边颜色
                  uncheckedBorderColor:Color.Yellow
              })
              .height(50)
              .width(50)
              .onChange((isChecked: boolean) => {
                console.log('Radio1 status is ' + isChecked)
              })

              Text('Radio2').fontSize(24)
              Radio({ value: 'Radio2', group: 'radioGroup' }).checked(false)
                  .radioStyle({
                      // 底版颜色
                      checkedBackgroundColor: Color.Blue,
                      // 钩子颜色
                      indicatorColor:Color.Red,
                      // 没选中的时候 描边颜色
                      uncheckedBorderColor:Color.Yellow
                  })
                  .height(50)
                  .width(50)
                  .onChange((isChecked: boolean) => {
                      console.log('Radio1 status is ' + isChecked)
                  })

          }
        }
    }
}