Question

我的Button应用中的QML上有一堆。由于同一页面上有许多按钮，因此用户可能很难看到最后按下了哪个按钮！所以我想更改最后一个Button字体以表示它已按下，但稍后当另一个按钮被按下时我想再次恢复它的字体。

我找不到一个很好的方法来做到这一点。我尝试将所有按钮连接到ButtonGroup，但我需要遍历所有按钮才能set underline to false，但是我尝试这样做会得到不同类型的错误。

请参阅以下示例：

Button {
    text: qsTr("Open")
    ButtonGroup.group: buttonGroup
    font.pointSize: 20; font.family: "Courier"
    onPressed:  { /* some action here*/ }
    onReleased: { /* some action here*/ }
}

Button {
    text: qsTr("Close")
    ButtonGroup.group: buttonGroup
    font.pointSize: 20; font.family: "Courier"
    onPressed:  { /* some action here*/ }
    onReleased: { /* some action here*/ }
}


ButtonGroup {
    id: buttonGroup

    function underlineButtons(underlined) {
        for (var i = 0; i < buttons.length; ++i) {
            children[i].font.underline = underlined;
        }
    }

    onClicked: {
        console.log(" -------------- buttonGroup Clicked: ", button.text)
        underlineButtons(false)         // restore old buttons
        button.font.underline = true    // mark the last button clicked
    }
}

我遇到以下错误，试图访问子元素。

qrc:/main.qml:65 ((null)): qrc:/main.qml:65: ReferenceError: children is not defined

Answer 1

简短回答

你可以

迭代按钮父级的children
或迭代buttons的{{1}}。

答案很长

每个QML项都有一个子属性，包含所有Item继承的子项。这意味着您可以迭代项目的子项，就像任何其他元素列表一样。

ButtonGroup

Item { id: container function setUnderlineOnChildren() { for (var i = 0; i < children.length; ++i) { children[i].font.underline = true; } } Button {} Button {} Button { onClicked: { container.setUnderlineOnChildren(); } } }用于创建互斥的可检查按钮（如单选按钮），如documentation中所述。但与大多数QML元素相反，因为它不代表图形元素，所以它继承了QtObject而不是Item。因此它不具有Items的ButtonGroup属性。但是你应该能够做到这一点，依靠children属性加入上面的

buttons

然后拨打ButtonGroup { id: myGroup buttons: container.children function underlineButtons(underlined) { for (var i = 0; i < buttons.length; ++i) { buttons[i].font.underline = underlined; } } }。

Answer 2

您也可以尝试使用activeFocus属性，然后在字体中查询该按钮是否处于活动焦点。

Button {
    text: qsTr("Open")
    font.pointSize: activeFocus ? 30 : 20
    font.family: "Courier"
    onPressed: {
        activeFocus = true
        /* some action here*/ }
    onReleased: {/* some action here*/ }
}

Button {
    text: qsTr("Close")
    font.pointSize: activeFocus ? 30 : 20
    font.family: "Courier"
    onPressed: {
        activeFocus = true
        /* some action here*/ }
    onReleased: {/* some action here*/ }
}

迭代ButtonGroup QML中的按钮

2 个答案: