Пользовательская полоса прокрутки для добавления верхней и нижней кнопок (стиль 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
            }
        }
    }
}

0 ответов

Другие вопросы по тегам