Monday, November 4, 2013

QtQuick.Controls examples - single selectable CheckBox in ExclusiveGroup

To make a group of CheckBox to be single selectable, we can apply the CheckBoxes to ExclusiveGroup.

CheckBoxes in ExclusiveGroup
Only one CheckBox can be checked in a ExclusiveGroup
Example:
import QtQuick 2.1
import QtQuick.Controls 1.0
import QtQuick.Window 2.0

ApplicationWindow {
    title: qsTr("qteveloper.blogspot.com")
    width: 400
    height: 350

    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }

    ExclusiveGroup {
        id: exclusiveGroup1
    }

    ExclusiveGroup {
        id: exclusiveGroup2
    }

    Column{
        Column {
            CheckBox {
                text: "option 1"
                exclusiveGroup: exclusiveGroup1
            }
            CheckBox {
                text: "option 2"
                exclusiveGroup: exclusiveGroup1
            }
            CheckBox {
                text: "option 3"
                exclusiveGroup: exclusiveGroup1
            }
        }
        Row {
            CheckBox {
                text: "option A"
                checked: true
                exclusiveGroup: exclusiveGroup2
            }
            CheckBox {
                text: "option B"
                exclusiveGroup:
                    exclusiveGroup2
            }
            CheckBox {
                text: "option C"
                exclusiveGroup: exclusiveGroup2
            }
        }
    }
}