当前位置: 首页 > article >正文

QML 将CheckBox添加到一个组,同一时间只能勾选一个,具有排他性

效果:

需要使用到 ButtonGroup 部件;

exclusive 属性需要设置为true,保持组中的按钮的排他性,有且只能选中一个按钮;

buttons 属性,给其赋值 list<AbstractButton> 参数即可将按钮组组合到一起;

使用一个布局类的children属性也可以实现;

// 按钮的组
ButtonGroup {
    id: childGroup

    // 保持组中的按钮的排他性,有且只能选中一个按钮
    exclusive: true
    buttons: col.children    // 使用方式2的话,这里可以注释掉
}


// 垂直属性
Column {
    id: col
    CheckBox {
        text: "first checkbox"
        checked: true   // 设置是否勾选
        //ButtonGroup.group: childGroup    // 方式2,也可以这样添加到组里
    }
    CheckBox {
        text: "second checkbox"
        checked: false   // 设置是否勾选
        //ButtonGroup.group: childGroup    // 方式2,也可以这样添加到组里
    }
    CheckBox {
        text: "third checkbox"
        checked: false   // 设置是否勾选
        //ButtonGroup.group: childGroup    // 方式2,也可以这样添加到组里
    }
}

也可以在CheckBox中直接添加到组里,ButtonGroup.group: childGroup

CheckBox 的 tristate 可以设置是否启用三种状态;

Qt.Unchecked                  0 没勾选
Qt.PartiallyChecked           1  -
Qt.Checked                    2 勾选
CheckBox {
    text: "first checkbox"
    checked: true   // 设置是否勾选

    // 设置为true,checkbox会有三个状态
    tristate: true
    onCheckStateChanged: {
        console.log(checkState)
    }
}

官方案例:

1.通过一个checkbox来控制全部checkbox的勾选

效果:

Column {
    ButtonGroup {
        id: childGroup
        exclusive: false
        checkState: parentBox.checkState
    }

    CheckBox {
        id: parentBox
        text: qsTr("Parent")
        checkState: childGroup.checkState
    }

    CheckBox {
        checked: true
        text: qsTr("Child 1")
        leftPadding: indicator.width
        ButtonGroup.group: childGroup
    }

    CheckBox {
        text: qsTr("Child 2")
        leftPadding: indicator.width
        ButtonGroup.group: childGroup
    }
}

2.可以自己控制勾选状态

效果:

CheckBox {
    tristate: true

    // 可以控制勾选
    nextCheckState: function() {
        // 如果当前时为勾选状态
        if (Qt.Unchecked === checkState) {
            // 返回勾选状态
            return Qt.Checked

        } else if (Qt.Checked === checkState) {
            return Qt.PartiallyChecked

        } else {
            return Qt.Unchecked
        }
    }
}

完!


http://www.kler.cn/a/559989.html

相关文章:

  • 接雨水的算法
  • 盲视观测者效应:认知的量子诗学 AI回复盲人双缝实验
  • 便携式动平衡仪Qt应用层详细设计方案(基于Qt Widgets)
  • 华为2025年技术发布会:智能汽车核心技术大爆发
  • 连接数据库的方式
  • 【JavaScript】《JavaScript高级程序设计 (第4版) 》笔记-Chapter22-处理 XML
  • Lecture 2 - Python
  • Apache Tomcat RCE 稳定复现 保姆级!(CVE-2024-50379)附视频+POC
  • JavaWeb-Servlet对象生命周期
  • 系统学习算法:专题十二 记忆化搜索
  • vue从入门到精通(十三):收集表单数据
  • 鸿蒙开发深入浅出01(基本环境搭建、页面模板与TabBar)
  • 基于SpringBoot+Vue前后端分离的旅游信息推荐管理系统设计与实现+毕业论文+指导搭建视频
  • 深入剖析 Java Pinpoint:分布式系统性能分析的利器
  • 1_安装JDK和Hadoop
  • 3-1 WPS JS宏工作簿的新建与保存(批量新建工作簿)学习笔记
  • 第438场周赛:判断操作后字符串中的数字是否相等、提取至多 K 个元素的最大总和、判断操作后字符串中的数字是否相等 Ⅱ、正方形上的点之间的最大距离
  • deepseek_清华大学指导手册_pdf_1-5
  • Python爬虫系统搭建教程,从0开始搭建爬虫系统(附安装包)
  • Qt 中的线程池QRunnable和QThreadPool