«Линейный градиент» затрудняет все основные элементы в QML

Question

Я хочу использовать Клиентское оформление для моего приложения и добавил следующий код для градиента фона строки заголовка:

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

Но это затрудняет все основные кнопки, а также панель поиска становится бесполезной. Нет проблем, хотя, когда я использую свойство background ToolBar:

background: {
         color: "#31333600"
}

Есть ли способ понизить фон строки заголовка?

* Я добавил кнопки и TextField после LinearGradient.

Answer 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 фон.