如何更改QML按钮Qt快速控件2的背景颜色?

Question

我只想更改QML按钮的背景颜色，但似乎没有简单的方法。你能告诉我一种更改QML按钮背景颜色的简单方法吗？谢谢！

更新：我搜索过的代码：

import QtQuick 2.6
import QtQuick.Controls 2.1
Button {
id: control
text: qsTr("Button")
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
implicitHeight: 40
opacity: enabled ? 1 : 0.3
border.color: control.down ? "#17a81a" : "#21be2b"
border.width: 1
radius: 2
color: "black"  // I update background color by this
}
}

Answer 1

QtQuick.Controls 2的常用方法是重新定义默认Control视觉属性以自定义Control。正如我上面所说，这种方法的缺点是您无法更改例如背景颜色。覆盖Control.background强制您重新定义所有元素，包括边框、颜色、动画等。

查看Button的源代码，我们可以看到它基于控件面板定义了默认Control.background属性。使用此属性，我们可以覆盖Control属性：

例如：

Button {        
text: "Test button"
palette {
button: "green"
}
}

但您应该了解，将来可能会更改内部源。此外，您还必须自己想象指定的控件使用哪些调色板属性。

在上面的示例中，我为指定的控件重新定义了调色板。但是您可以全局重新定义调色板，可以在 qtquickcontrols2.conf 中设置颜色，也可以在 C++ - QGuiApplication：：setPalette(( 中设置自定义调色板。

Answer 2

适用于 QT Quick 2：

Button {
id: button
text: qsTr("Button text")
background: Rectangle {
color: parent.down ? "#bbbbbb" :
(parent.hovered ? "#d6d6d6" : "#f6f6f6")
}
}

上面的代码在按钮按下或悬停时更改按钮颜色。也可以添加边框或其他自定义项。

Answer 3

你可以简单地用ButtonMaterial.background来做到这一点：

Button 
{
id: button
Material.background:Material.Red
}