“线性渐变”阻碍了 QML 中的所有底层项目

Posted 2023-03-17

【中文标题】“线性渐变”阻碍了 QML 中的所有底层项目

【英文标题】："Linear gradient" hampers all underlying items in QML

【发布时间】：2020-08-14 17:03:34

【问题描述】：

我想为我的应用使用Client-side Decoration，并为标题栏的背景渐变添加了以下代码：

Page 
    anchors.fill: parent
    header: ToolBar 
        LinearGradient 
            anchors.fill: parent
            gradient: Gradient 
                GradientStop  position: 0.0; color: "#555555" 
                GradientStop  position: 1.0; color: "black" 
            
        

但它妨碍了所有底层按钮，而且搜索栏也变得毫无用处。 但是当我使用ToolBar 的background 属性时没有问题：

background: 
         color: "#31333600"

有没有办法降低标题栏背景？

*我在LinearGradient之后添加了按钮和TextField。

【参考方案1】：

首先，确保您使用的是 Quick Controls 2 工具栏并按照此处的说明对其进行自定义：

https://doc.qt.io/qt-5/qtquickcontrols2-customize.html#customizing-toolbar

例如：

Page 
    anchors.fill: parent
    header: ToolBar 
        background: LinearGradient 
            implicitHeight: 40
            gradient: Gradient 
                GradientStop  position: 0.0; color: "#555555" 
                GradientStop  position: 1.0; color: "black" 
            
        
    

这里有一些关于implicitHeight 的文档：

https://doc.qt.io/qt-5/qml-qtquick-item.html#implicitHeight-prop

工具栏将从背景的implicitHeight 设置其隐式高度。

【讨论】：

implicitHeight 是什么意思？我找不到任何文档。

doc.qt.io/qt-5/qml-qtquick-item.html#implicitHeight-prop