Qml-Button的使用
import QtQuick
import QtQuick.Controls
//
Item{
height: 480
width: 320
Row{
anchors.top: parent.top
anchors.left: parent.left
anchors.margins: 10
spacing:10
Button{
id:idBut1
text:"Button"
height: 30
onClicked: {
console.log("idBut1 Clicked");
}
onPressed: {
console.log("idBut1 onPressed");
}
onReleased: {
console.log("idBut1 onReleased");
}
onToggled: {
console.log("idBut1 onToggled");
}
//按下,在按钮区域外释放(release)会触发 canceled 信号
onCanceled: {
console.log("idBut1 onCanceled");
}
onPressAndHold: {
console.log("idBut1 onPressAndHold");
}
}
Button{
id:idButRepeat
text:"Repeate"
autoRepeat: true //autoRepeat 为true,pressAndHold 信号不得触发
autoRepeatDelay: 500 //初次一直按下,重复的延迟时间 ms,默认是300
autoRepeatInterval: 300 //按下后,重复的间隔时间 ms 默认是200 ms
height: 30
onClicked: {
console.log("idButRepeat Clicked");
}
onPressed: {
console.log("idButRepeat onPressed");
}
onReleased: {
console.log("idButRepeat onReleased");
}
onToggled: {
console.log("idButRepeat onToggled");
}
onCanceled: {
console.log("idButRepeat onCanceled");
}
onPressAndHold: {
console.log("idButRepeat onPressAndHold");
}
}
Button{
id:idButCheckable
text:"Checkable"
height: 30
checkable: true
onClicked: {
console.log("idButCheckable Clicked");
}
onPressed: {
console.log("idButCheckable onPressed");
}
onReleased: {
console.log("idButCheckable onReleased");
}
//属性checkable:true,在clicked时,checked状态发生改变,触发toggled信号
onToggled: {
console.log("idButCheckable onToggled ",idButCheckable.checked ? " checked " : " unchecked ");
}
onCanceled: {
console.log("idButCheckable onCanceled");
}
onPressAndHold: {
console.log("idButCheckable onPressAndHold");
}
}
Button{
id:idButIcon
text:"ButtonIcon"
//flat:true //flat为true,不绘制背景外观
//highlighted: true
// height: 30
icon.source: "qrc:/qt/qml/text/qmlDemo/Resource/face-smile.png" //使用qrc资源,格式"qrc:前缀/前缀后相对路径"
icon.color: "transparent" //如果qrc路径没问题,color未设置,是个黑色圆圈
//display: AbstractButton.IconOnly //枚举值一般首字母大写
display: AbstractButton.TextBesideIcon
}
}
}