Qml——Button元素

sycmancia2026-10-28 11:12

1.Qml中的Button元素和Qt中的QPushButton类似，它的基类是AbstractButton，而AbstractButton的子元素除了Button外，还有CheckBox、DelayButton等按钮相关元素

2.AbstractButton基类

（1）为Button提供了下面属性：

autoRepeat：bool，默认为false，如果为true，则鼠标按下后会一直发送onClicked()信号，并不会发出pressAndHold()（按下并持续按住）信号，如果为true，则可以通过autoRepeatDelay和autoRepeatInterval来设置延时和间隔，比如播放器快进按钮，就需要重复按下功能
autoRepeatDelay：int，默认为300，用来设置自动重复的初始延迟（以毫秒为单位），从用户按下按钮开始，到第一次触发自动重复事件之间需要等待的时间
autoRepeatInterval：int，默认为100，用来设置毫秒内保持自动重复的间隔（以毫秒为单位），后续每一次触发之间的时间间隔

3.checked、pressed、down的区别

checked：逻辑开关，常用于CheckBox、Switch或可切换按钮，表示业务逻辑上的选择结果
pressed：物理按压状态，表示按钮此刻是否正被物理按下
down：down 会跟随 pressed 的值，所以按下时它自动为 true，松开后为 false。但它与 pressed 的关键区别在于：down 可以被手动设置

4.Button的自定义颜色和背景

复制代码

Item{
        anchors.fill: parent
        focus: true
        Button{
            id: btn
            text: "button"
            contentItem: Label{
                text: parent.text
                font: parent.font
                color: parent.down ? "blue" : "green"
                horizontalAlignment: Text.AlignHCenter //文本在水平方向居中对齐
                verticalAlignment: Text.AlignVCenter //文本在垂直方向居中对齐
                elide: Text.ElideRight //省略右边的文字
            }
            background: Rectangle{
                implicitWidth: 100
                implicitHeight: 40
                color: parent.down ? "white" : "red"
                radius: 7
                border.width: 2
                border.color: parent.down ? "#E5E5E5" : "#8C8D8D"
            }
        }
    }

运行结果：