CheckboxGroup HarmonyOS 鸿蒙Next

CheckboxGroup HarmonyOS 鸿蒙Next

cke_287.png

如何让CheckboxGroup中的SelectAll只出现选中和未选中两个状态不要部分选中的状态


更多关于CheckboxGroup HarmonyOS 鸿蒙Next的实战教程也可以访问 https://www.itying.com/category-93-b0.html

5 回复

楼主看看一楼的方案是否满足，只有选中和选不中两种状态，可以全选和取消全选

更多关于CheckboxGroup HarmonyOS 鸿蒙Next的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


再设置一个CheckboxGroup遮挡，参考示例

@Entry
@ComponentV2
struct Index {
  @Local selectPart: SelectStatus = SelectStatus.None

  build() {
    Scroll() {
      Column({ space: 10 }) {
        Row() {
          Stack() {
            CheckboxGroup({ group: 'kai' })
              .width(30)
              .onChange((value: CheckboxGroupResult) => {
                console.log('CheckboxGroup onChange: ' + value.status)
                this.selectPart = value.status
              })
            CheckboxGroup({ group: 'kai_copy' })// 用于遮挡部分选中的横杠
              .width(30)// 与CheckboxGroup保持一致
              .backgroundColor(Color.White)// 与背景色相同，不显示
              .hitTestBehavior(HitTestMode.None)
              .visibility(this.selectPart == SelectStatus.Part ? Visibility.Visible : Visibility.None)
          }

          Text(this.selectPart == SelectStatus.Part ? 'Part' : this.selectPart == SelectStatus.All ? 'All' : 'None')
            .fontSize(20)
        }

        Row() {
          Checkbox({
            group: 'kai',
            name: 'name1',
          })
          Text('checkbox1')
        }

        Row() {
          Checkbox({
            group: 'kai',
            name: 'name2',
          })
          Text('checkbox2')
        }

        Row() {
          Checkbox({
            group: 'kai',
            name: 'name3',
          })
          Text('checkbox3')
        }
      }
      .width('100%')
    }

  }
}

找HarmonyOS工作还需要会Flutter的哦，有需要Flutter教程的可以学学大地老师的教程，很不错，B站免费学的哦：BV1S4411E7LY/?p=17

但我想要的是当选择checkbox1和checbox2,selectAll是未选中的空白状态,此时点击selectAll会让checkbox123全部选中,再次点击selectAll会让checkbox123全部取消选中

在HarmonyOS（鸿蒙）系统中，CheckboxGroup 组件用于创建一组互斥选项，用户只能选择其中的一个选项。这种组件在处理表单或者设置选项时非常有用，因为它可以确保用户不会同时选择多个互斥的选项。

在鸿蒙的UI框架中，CheckboxGroup 组件通常与其他复选框（Checkbox）组件配合使用。这些复选框会加入到CheckboxGroup中，从而形成一个选项组。用户只能选择该组中的一个复选框。

要使用CheckboxGroup，你需要：

  1. 创建CheckboxGroup实例：在XML布局文件或Java代码中创建CheckboxGroup实例。
  2. 添加Checkbox到CheckboxGroup：将需要互斥的Checkbox组件添加到CheckboxGroup中。这可以通过设置Checkbox的group属性或在代码中显式添加来实现。
  3. 处理选择事件：为CheckboxGroup或其中的Checkbox设置事件监听器，以便在用户选择不同选项时执行相应的操作。

请注意，鸿蒙系统的UI组件和API可能会随着版本的更新而有所变化，因此建议查阅最新的鸿蒙开发文档以获取最准确的信息。

如果问题依旧没法解决请联系官网客服,官网地址是 https://www.itying.com/category-93-b0.html，

回到顶部