How to enable to scrolling Rectangle which contains text?

[moon9yu]

Hi, I want to scroll rectangle's text like terminal.
But the problem is it doesn't scrollable...

This is my part of qml file.

Window {
    id: mainWindow
    width: 640
    height: 480
    visible: true
    title: qsTr("SOME/IP Simulator")

    RowLayout {
        property string someipLog
        id: mainRow
        anchors.fill: parent
        spacing: 10

        Rectangle {
            id: consoleItem
            Layout.fillHeight: parent.height
            Layout.minimumHeight: mainWindow.height
            Layout.minimumWidth: mainWindow.width / 3 * 2
            color: "black"
            clip: true
            Text {
                id: logArea
                anchors.fill: parent
                text: simulator.someipLog // text from c++ class
                wrapMode: Text.WrapAnywhere
                color: "white"
                font.pointSize: 13
                font.weight: Font.Medium
            }
            ScrollBar {
                hoverEnabled: true
                active: hovered || pressed
                orientation: Qt.Vertical
                size: consoleItem.height / logArea.height
                anchors.top: parent.top
                anchors.right: parent.right
                anchors.bottom: parent.bottom
            }
        }

        Items ...
    }
}

[Bob64]

@moon9yu There is nothing to connect your scrollbar to the text rectangle. Have you tried ScrollView? That would do most of your work for you.

[moon9yu]

@Bob64 Thank you for replying. I solved my problem using flickable.

Rectangle {
            id: consoleItem
            Layout.fillHeight: parent.height
            Layout.minimumHeight: mainWindow.height
            Layout.minimumWidth: mainWindow.width / 3 * 2
            color: "black"
            Flickable {
                id: flickable
                contentHeight: logArea.implicitHeight
                contentWidth: logArea.implicitWidth
                contentY: contentHeight - height
                boundsMovement: Flickable.StopAtBounds
                anchors.fill: parent
                clip: true
                Text {
                    id: logArea
                    text: simulator.someipLog
                    color: "white"
                    font.pointSize: 13
                    font.weight: Font.Medium
                    padding: 10
                }
                ScrollBar.vertical: ScrollBar {
                    id: vbar
                    active: hovered || pressed
                    orientation: Qt.Vertical
                    parent: flickable.parent
                    anchors.top: flickable.top
                    anchors.right: flickable.right
                    anchors.bottom: flickable.bottom
                }
                ScrollBar.horizontal: ScrollBar {
                    id: hbar
                    active: hovered || pressed
                    orientation: Qt.Horizontal
                    parent: flickable.parent
                    anchors.left: flickable.left
                    anchors.right: flickable.right
                    anchors.bottom: flickable.bottom
                }
            }
        }