scroll horizontal and vertical for a very large rectangle

lawrence.emke

I have been playing with the scroll view and other view models.
I want to create a game board (a very large rectangle) and place pieces
(which are buttons that can be clicked and dragged) on the rectangle content. The board (i.e. rectangle) could have any dimensions (i.e. larger than the physical size of the device. The user might want to make the view port small (not full screen) I wanted to have scroll bars both horizontal and vertical always visible. That was easy. But they are not functional. The rectangle is physically anchor to the application window. Nothing more can be seen.

How do I get the scroll bars to change the view of the large rectangle. I would think/hope such a thing would be a general
widget. i.e.: just choose the widge; define the size of the scroll area
and have the scroll bars navigate the scroll area accordingly.

Does not seem to work. Can anyone help?

ODБOï

@lawrence-emke hi,
i think what you need is QML Flickable type

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Flickable {
        width: 400; height: 400
        contentWidth: gameBoard.width; contentHeight: gameBoard.height
        clip: true
        ScrollBar.horizontal: ScrollBar { active: true}
        ScrollBar.vertical: ScrollBar {  active: true}
        Rectangle{
            id: gameBoard
            height: 2000
            width: 2000
            color: "grey"
            Repeater{
                model: 10
                Drag.active: dragMouse.drag.active
                Rectangle{
                    height: 80;width: 80
                    x : width * index
                    y : height * index
                    color: Qt.rgba(Math.random(),Math.random(),Math.random(),1)
                    MouseArea{
                        id:dragMouse
                        anchors.fill: parent
                        drag.target: parent
                    }
                }
            }
        }
    }
}

lawrence.emke

This post is deleted!