QML ButtonGroup怎么互斥Rectangle

在QML中，可以通过`ButtonGroup`和`exclusive`属性来实现互斥的按钮组。当`exclusive`属性设置为`true`时，同一时间只允许一个按钮处于选中状态。

以下是一个示例代码，其中有两个互斥的矩形，当选中一个时，另一个会取消选中状态：

import QtQuick 2.0

Rectangle {
    width: 200
    height: 100

    ButtonGroup {
        id: group
        exclusive: true // 设置为互斥
    }

    Rectangle {
        id: rect1
        width: 50
        height: 50
        color: group.checkedButton === button1 ? "red" : "gray" // 根据选中状态设置颜色
        Button {
            id: button1
            text: "Button 1"
            checkable: true // 设置为可选中
            ButtonGroup.group: group // 将按钮添加到按钮组
        }
    }

    Rectangle {
        id: rect2
        x: 100
        width: 50
        height: 50
        color: group.checkedButton === button2 ? "red" : "gray" // 根据选中状态设置颜色
        Button {
            id: button2
            text: "Button 2"
            checkable: true // 设置为可选中
            ButtonGroup.group: group // 将按钮添加到按钮组
        }
    }
}

在上述代码中，我们首先创建了一个`ButtonGroup`，将其`exclusive`属性设置为`true`，表示该组中的按钮互斥。然后在两个矩形中创建了一个按钮，并将它们添加到按钮组中。在矩形的颜色属性中，我们使用`group.checkedButton`来获取当前选中的按钮，根据其选中状态设置颜色。

这样，当我们点击一个矩形中的按钮时，另一个矩形中的按钮会自动取消选中状态，从而实现了互斥的效果。