Как изменить цвет * просто * заголовка?
Есть ли нехакерский способ изменить цвет , просто заголовок в приложении, использующем Ubuntu SDK? MainView имеет свойство headerColor, но оно используется в качестве первого шага градиента. В настоящее время я просто помещаю туда цветной прямоугольник:
Rectangle {
id: headerBackground
height: header.height
width: header.width
anchors.top: parent.top
color: "#288369"
}
Но это вызывает ряд проблем, в особенности это несопоставимо с ListView, который заполняет всю страницу. Полный пример можно найти в этой сущности .
2 ответа
Указатель Michael на реализацию Машины Кармы действительно указывал на меня в правильном направлении. Ключ вводит прямоугольник в заголовок так, чтобы это был надлежащий ребенок. Это может быть сделано с createObject () метод , который упомянул Michael, есть ли у Вас прямоугольник в отдельном qml файле, или можно использовать createQmlObject со строкой QML.
Ниже очень упрощенный пример (использующий Вкладки, но то же самое возможно с PageStack):
import QtQuick 2.0
import Ubuntu.Components 0.1
MainView {
id: mainView
width: units.gu(40)
height: units.gu(60)
Tabs {
id: tabs
Tab {
title: i18n.tr("Colored Header")
page: Page {
}
}
}
Component.onCompleted: {
tabs.tabBar.__styleInstance.headerTextSelectedColor = "white";
var component = Qt.createQmlObject(
'import QtQuick 2.0; Rectangle { anchors.fill: parent; z: -1; color: "#288369"; }',
tabs.header);
}
}
Попробуйте установку anchors.fill: header, тот способ, которым это всегда остается в границах компонента Заголовка.
можно также проверить более подробную реализацию от KarmaMachine:
В нижней части здесь разработчик создает новый компонент HeaderArea, который является ребенком pageStack.header https://github.com/brianrobles204/Karma-Machine/blob/master/KarmaMachine.qml#L489
с помощью QML Component.createObject () метод от: http://developer.ubuntu.com/api/qml/sdk-14.04/QtQml.Component/#createObject-method
Тогда в HeaderArea он устанавливает привязки для заполнения родителя, который является pageStack.header: https://github.com/brianrobles204/Karma-Machine/blob/master/HeaderArea.qml#L19
Он также делает намного больше для добавления функциональности к заголовку, но это должно дать Вам общее представление о том, как сделать это.
-
1Спасибо. Пример KarmaMachine похож на него, укажет на меня в правильном направлении. К сожалению, использование
anchors.fill: headerвсе еще имеет ту же проблему с ListView. См.: gist.github.com/andrewsomething/9294239 – eckig 14.05.2020, 13:10