Question

我的页面有结构，我想为我的按钮添加一些ButtonStyle（我按照文档中的示例），现在我有一个问题，为什么我不能为此按钮添加style 。以下是我的页面结构

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3
import QtQuick.Controls.Styles 1.4
Page
{
...
header: ToolBar {
    ...
    RowLayout{
        Button {
        ...
        style: ButtonStyle {
            background: Rectangle {
            implicitWidth: 100
            implicitHeight: 25
            border.width: control.activeFocus ? 2 : 1
            border.color: "#888"
            radius: 4
            gradient: Gradient {
                GradientStop { position: 0 ; color: control.pressed ? "#ccc" : "#eee" }
                GradientStop { position: 1 ; color: control.pressed ? "#aaa" : "#ccc" }
                }
            }
        }
        }
    }
}
}

Answer 1

您选择了QtQuick Controls 2 Button（import QtQuick.Controls 2.0），可以使用background直接设置样式（即不需要QtQuick.Controls.Styles）... { {3}}。另一方面，如果您想使用QtQuick.Controls 1.x按钮，则需要将导入更改为import QtQuick.Controls 1.4以及QtQuick.Controls.Styles 1.4，并且您的样式将有效... Customizing Qt Quick Controls 2。

使用QtQuick Controls 2，您可以直接使用Button设置background样式：

Button {
    id:control
    background: Rectangle {
        implicitWidth: 100
        implicitHeight: 25
        border.width: control.activeFocus ? 2 : 1
        border.color: "#888"
        radius: 4
        gradient: Gradient {
            GradientStop { position: 0 ; color: control.pressed ? "#ccc" : "#eee" }
            GradientStop { position: 1 ; color: control.pressed ? "#aaa" : "#ccc" }
        }
    }
}

Qml样式按钮

1 个答案: