ScrollBar policy not working as expected

[mzimmers]

Hi all -

According to the docs:

ScrollBar.AsNeeded The scroll bar is only shown when the content is too large to fit.

So then, why, in this example:

ApplicationWindow {
    id: mainWindow

    visible: true
    width: 640
    height: 480

    ScrollView {
        id: scrollView
        height: 200
        width: 400
        contentHeight: textArea.contentHeight

        TextArea {
            id: textArea
            text: "top\nbottom"
            background: Rectangle {
                width: scrollView.width
                color: 'lightgray'
                border.width: 1
            }
        }

        ScrollBar.vertical: ScrollBar {
            id: scroller
            policy: ScrollBar.AsNeeded
            anchors.left: scrollView.right
            contentItem: Rectangle {
                implicitHeight: scrollView.height
                implicitWidth: 12
                color: 'lightblue'
            }
            background: Rectangle {
                anchors.fill: parent
                color: 'transparent'
            }
        }
    }
}

Do I get a visible ScrollBar?

I've tried with Fusion and Universal (running on Windows) - same result.

Thanks...

[JoeCFD]

@mzimmers
one way to make it working

ApplicationWindow {
    id: mainWindow

    visible: true
    width: 640
    height: 480

    ScrollView {
        id: scrollView
        height: 200
        width: 400
        contentHeight: textArea.contentHeight

        TextArea {
            id: textArea
            text: "top\nbottom\ntop\nbottom\nbottom\ntop\nbottom\nbottom\ntop\nbottom\nbottom\ntop\nbottom\nbottom\ntop\nbottom"
            background: Rectangle {
                width: scrollView.width
                color: 'lightgray'
                border.width: 1
            }
        }

        ScrollBar.vertical: ScrollBar {
            id: scroller
            anchors.right: scrollView.right /*   anchors.left or right? */
            visible: textArea.contentHeight > scrollView.height

            contentItem: Rectangle {
                implicitHeight: scrollView.height
                implicitWidth: 12
                color: 'lightblue'
            }
    
            background: Rectangle {
                anchors.fill: parent
                color: 'transparent'
            }
        }
    }
}

[JoeCFD]

This post is deleted!

[mzimmers]

@JoeCFD your first suggestion works (I couldn't get the second one to work). I'm curious, though - why is this necessary?

[JoeCFD]

@mzimmers True that the second one does not work. Sorry! I tested it and saw it worked. I must have done something differently. I will check it out later.