按钮类控件

 Qt Quick
时间:

Qt Quick Controls提供了5类按钮:Button,CheckBox,RadioButton,Switch和ToolButton。

ExclusiveGroup

一般的按钮都包含一个exclusiveGroup属性,需要指定一个ExclusiveGroup类型的对象。ExclusiveGroup类型可以包含多个Action对象,使得这些Action能够彼此互斥。当Action被添加到ExclusiveGroup时,ExclusiveGroup对象会自动赋值给每一个Action对象的Action::exclusiveGroup属性。

import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Window 2.1

ApplicationWindow {
    ExclusiveGroup {
        id: radioInputGroup
        Action { id: dabRadioInput; text: "DAB"; checkable: true }
        Action { id: fmRadioInput; text: "FM"; checkable: true }
        Action { id: amRadioInput; text: "AM"; checkable: true }
    }

    toolBar: ToolBar {
        id: mainToolBar; width: parent.width
        Row {
            anchors.fill: parent
            ToolButton { action: dabRadioInput }
            ToolButton { action: fmRadioInput }
            ToolButton { action: amRadioInput }
        }
    }
}

ExclusiveGroup仅支持将Action对象添加为自己的子元素,所以当我们需要使用其他控件时,只能显式地将ExclusiveGroup对象赋值给这些元素各自地exclusiveGroup属性。
第二种实现方法:

import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Window 2.1


ApplicationWindow {
    ExclusiveGroup { id: radioInputGroup }
    toolBar: ToolBar {
        id: mainToolBar; width: parent.width
        Row {
            anchors.fill: parent
            ToolButton {
                id: dabRadioInput; text: "DAB";
                checkable: true; exclusiveGroup: radioInputGroup
            }

            ToolButton {
                id: fmRadioInput; text: "FM";
                checkable: true; exclusiveGroup: radioInputGroup
            }

            ToolButton {
                id: amRadioInput; text: "AM";
                checkable: true; exclusiveGroup: radioInputGroup
            }
        }
    }
}

Button

Button对应着C++中的QPushButton,是Qt Quick Controls中最普通的按钮。
Button既可以使用Action进行初始化,也可以通过自己的属性初始化。

import QtQuick 2.2
import QtQuick.Controls 1.4
import QtQuick.Window 2.3

ApplicationWindow {
    visible: true
    Button {
        x: 10; y: 10; width: 140
        text: qsTr("Button with Menu")
        menu: Menu {
            MenuItem { text: qsTr("Item1") }
            MenuItem { text: qsTr("Item2") }
        }
    }
}

与QPushButton一样,Button也提供了checkable和checked属性,可以将按钮设置为有状态的形式。Button的exclusiveGroup属性可以将几个Button对象组成一个互斥的组,当其中之一被选择时,其余自动消失选择。

CheckBox(复选框)

CheckBox对应着C++中的QCheckBox,是一个复选框。通常用于设置或取消应用程序中相对独立的选项。

import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Window 2.3

ApplicationWindow {
    CheckBox {
        width: 140
        text: qsTr("3-state Check Box")
        partiallyCheckedEnabled: true
    }
}

CheckBox可以有选中和未选中两种状态。另外,CheckBox还可以处于一种“部分选中”的状态,也就是说,checkBox实际是有3种状态。部分选中的状态在带有子项的选择中,比如在树状列表中尤为常见。可以通过partiallyCkeckedEnabled属性来启用部分选中状态。代码中可以设置checjedState属性值为Qt.ParitallyChecked来将CheckBox设置为部分选中。

RadioButton(单选框)

RadioButton对饮着C++中的QRadioButton,是一个单选框。通常用于表示“多个选项中的一个”这种选择。一般需要将几个RadioGroup放在一个互斥的组中使用,当其中之一被选择时,其余可以自动取消选择。

import QtQuick 2.2
import QtQuick.Controls 1.4
import QtQuick.Window 2.3

ApplicationWindow {
    Column {
        ExclusiveGroup { id: group }
        RadioButton {
            text: qsTr("From top")
            exclusiveGroup: group
            checked: true
        }

        RadioButton {
            text: qsTr("From currsor")

            exclusiveGroup: group
            //checked: true
        }
    }
}

Switch

Switch 是从移动平台引入的一个控件,用于表示相对独立的,具有启用和禁用两种状态的情况。Switch非常类似于CheckBox或者互斥成组的RadioButton。

import QtQuick 2.2
import QtQuick.Controls 1.4
import QtQuick.Window 2.1

ApplicationWindow {
    Column {
        spacing: 8
        Switch { checked: true }
        Switch { checked: false }
    }
}

0 评论