QML中多个RadioButton的互斥使用及Button添加下拉菜单

最新推荐文章于 2025-10-13 19:22:10 发布

原创

最新推荐文章于 2025-10-13 19:22:10 发布 · 5.9k 阅读

3 ·

CC 4.0 BY-SA版权

本文详细介绍了如何在QML中实现多个RadioButton的互斥功能，确保用户只能选择其中一个选项。同时，文章还展示了如何为Button组件添加下拉菜单，以提供更丰富的交互体验。通过具体的代码示例，读者可以了解并应用到自己的QML项目中。

在QML中多个RadioButton要在一组进行使用时，往往是互斥使用的，及选了一个后，其他就要为非选中状态，这个功能可以用QML中的ExclusiveGroup先创建一个对象，然后每个RadioButton中，给他的exclusiveGroup属性赋值为创建的那个ExclusiveGroup的对象，这样，多个RadioButton就可以互斥选中了。

具体实现如下：

import Material 0.1
import QtQuick 2.4
import QtQuick.Layouts 1.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4

Window {
    id: win
    visible: true
    property string windowBgColor: "white"

    width: 200
    height:300

    RowLayout {
        id: row
        anchors.centerIn: parent
        ExclusiveGroup { id: exclusive }

        RadioButton {
            id: rd1
            exclusiveGroup: exclusive
            checked: true
            text:qsTr("基本设置")
        }
        RadioButton {
            id: rd2
            exclusiveGroup: exclusive
            text:qsTr("其他设置")
        }
    }

    Button {
        id: btn
        anchors.top: row.bottom
        anchors.topMargin: 15
        anchors.left: row.left

        width: