Пользовательская полоса прокрутки для добавления верхней и нижней кнопок (стиль Windows)
У меня есть приложение QT, и мне нужно настроить свой ListView ScrollBar, чтобы иметь прокрутку Windows Look&Fell, включая верхнюю и нижнюю кнопки (для прокрутки вверх или вниз при нажатии)
Насколько я знаю, все, что я могу настроить из ScrollBar, это contentItem и фон. По умолчанию нет способа добавить эти верхнюю и нижнюю кнопки. Добавить его вручную
Чтобы добавить кнопки сверху и снизу, я добавил поля в contentItem, поэтому у меня есть место для моих кнопок. Но с этим полем высота contentItem меньше, и с большим количеством элементов в моем ListView дескриптор НЕ виден...
Можно ли иметь минимальную высоту для contentItem? Есть ли другой способ иметь эти 2 кнопки?
заранее спасибо
Код:
import QtQuick 2.7
import QtQuick.Controls 2.0
Item {
anchors.fill: parent
MouseArea {
anchors.fill: id_list
onWheel: id_list.flick(0, wheel.angleDelta.y * 5)
}
ListModel {
id: listModel
Component.onCompleted: {
for (var i = 0; i < 1000; i++)
append({ role_text: "Item " + i});
}
}
ListView {
id: id_list
anchors.fill: parent
interactive: false
boundsBehavior: Flickable.StopAtBounds
focus: true
Keys.onPressed: {
if (event.key === Qt.Key_Up) id_list.flick(0, 500)
else if (event.key === Qt.Key_Down) id_list.flick(0, -500)
}
keyNavigationEnabled: true
model: listModel
ScrollBar.vertical: ScrollBar {
id: id_scroll
interactive: true;
policy: ScrollBar.AlwaysOn
anchors { top: parent.top; topMargin: 0; bottom: parent.bottom; bottomMargin: 0; right: parent.right/*; rightMargin: -2*/}
contentItem: Item {
implicitWidth: 11
implicitHeight: 100
Rectangle {
anchors { top: parent.top; topMargin: 13; bottom: parent.bottom; bottomMargin: 13; left: parent.left; leftMargin: -2; right: parent.right; rightMargin: -2}
color: "green"
}
}
background: Item {
implicitWidth: 11
implicitHeight: id_scroll.height
Rectangle {
anchors { top: parent.top; bottom: parent.bottom; bottomMargin: 0; left: parent.left; right: parent.right}
color: "#ededed"
}
Rectangle {
anchors { top: parent.top; right: parent.right }
height: 15; width: height
color: "red"
MouseArea {
anchors.fill: parent
onClicked: id_list.flick(0, 500)
}
}
Rectangle {
anchors { bottom: parent.bottom; right: parent.right }
height: 15; width: height
color: "red"
MouseArea {
anchors.fill: parent
onClicked: id_list.flick(0, -500)
}
}
}
}
delegate: Rectangle {
height: 40
width: id_list.width
color: "white"
border { color: "black"; width: 1 }
TextEdit {
anchors.centerIn: parent
id: id_text
text: role_text;
selectByMouse: true;
readOnly: true;
persistentSelection: true
}
}
}
}