1.概念

Button：是一个可点击的控件，它可以启动一个动作，或者打开或关闭一个弹出窗口。按钮通常有一个文本标签，但它也可以包含一个图标。当弹出框或对话框需要执行操作时，按钮是一个非常合适的控件。最常见的例子是OK, Apply, Cancel, Close, Yes, No, 和Help按钮。按钮的默认外观如下：

2.导入语句

import QtQuick.Controls 2.2

3.属性介绍

bool flat

此属性用于表示按钮是否为平面按钮。平面按钮通常不会绘制背景，除非它被按下或选中。默认值为false。

    Button {text: "Push Me"anchors.centerIn: parentflat:true}

显示： 

 

bool highlighted

此属性保持按钮是否高亮显示。为了吸引用户的注意力，按钮可以被高亮显示。它对键盘交互没有影响。默认值为false。

    Button {text: "Push Me"anchors.centerIn: parenthighlighted:true}

显示：

 

4.信号

当按钮被用户激活时，它会发出clicked()信号。 连接到这个信号来执行按钮的动作。 除此之外，按钮还提供如下信号：canceled()， doubleclick ()， pressed()， released()和pressAndHold()。

void canceled()
当按钮在被按下时失去鼠标抓取，或者当它将发出释放信号但鼠标光标不在按钮内时，将发出此信号。  

void clicked()
当用户通过触摸、鼠标或键盘单击按钮时，就会发出这个信号。

void doubleClicked()
当用户通过触摸或鼠标双击按钮时发出此信号。 

void pressAndHold()
当用户通过触摸或鼠标按下按钮且不松开时，就会发出这个信号。

void pressed()
当用户通过触摸、鼠标或键盘按下按钮时，就会发出这个信号。    

void released()
当用户通过触摸、鼠标或键盘释放按钮时，就会发出这个信号。 

void toggled()
当用户通过触摸、鼠标或键盘切换按钮开关状态时，就会发出此信号。

按钮信号响应

通过在信号名前面加on来构造一个响应函数，然后在冒号后面开始写处理信号的代码。

    Button {text: "Push Me"anchors.centerIn: parenthighlighted:trueonClicked: {console.log("onClicked")}onReleased: {console.log("onReleased")}onPressed: {console.log("onPressed")}onCanceled: {console.log("onCanceled")}onDoubleClicked: {console.log("onDoubleClicked")}onPressAndHold: {console.log("onPressAndHold")}}

5.自定义按钮样式

    Button {id: controltext: "Push Me"anchors.centerIn: parent//按钮由两个视觉项组成:背景项和内容项。contentItem: Text {text: control.text  //文本font: control.font  //字体opacity: enabled ? 1.0 : 0.3    //文本的透明度color: control.down ? "#17a81a" : "#21be2b" //文本颜色horizontalAlignment: Text.AlignHCenter  //水平对齐方式verticalAlignment: Text.AlignVCenter    //垂直对齐方式elide: Text.ElideRight  //设置文本的省略策略}background: Rectangle {implicitWidth: 100  //隐式宽度，在没有设置width属性时用此项来定义自然宽度implicitHeight: 40  //隐式高度，在没有设置height属性时用此项来定义自然高度opacity: enabled ? 1 : 0.3  //背景透明度border.color: control.down ? "#17a81a" : "#21be2b"  //边框颜色border.width: 1 //边框宽度radius: 2   //边框圆角弧度}}