CODEWITHSUNDEEP
qtqmlqtquickcontrols2
jkj yuio
jkj yuio

Reputation: 2613

Qt 5.9 QML How to show ScrollBar on key up/down in material style with Flickable TextArea

I want to put some text in a Flickable that can also scroll using keys up and down. It works, but the scrollbar does not show when scrolling with keys after it has already faded. Mouse wheel scrolling works fine.

-style universal doesn't show
-style material doesn't show
-style default does show

here's my code:

import QtQuick 2.7
import QtQuick.Controls 2.2

ApplicationWindow
{
    visible: true
    width: 640
    height: 480

    Flickable
    {
        anchors.fill: parent
        flickableDirection: Flickable.VerticalFlick
        focus: true

        TextArea.flickable: TextArea 
        {
            text:

        "Lorem ipsum dolor sit amet, consectetur adipisicing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna " +
        "aliqua. Ut enim ad minim veniam, quis nostrud exercitation " +
        "ullamco laboris nisi ut aliquip ex ea commodo cosnsequat. " +

        "Lorem ipsum dolor sit amet, consectetur adipisicing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna " +
        "aliqua. Ut enim ad minim veniam, quis nostrud exercitation " +
        "ullamco laboris nisi ut aliquip ex ea commodo cosnsequat. " +

        "Lorem ipsum dolor sit amet, consectetur adipisicing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna " +
        "aliqua. Ut enim ad minim veniam, quis nostrud exercitation " +
        "ullamco laboris nisi ut aliquip ex ea commodo cosnsequat. " +

        "Lorem ipsum dolor sit amet, consectetur adipisicing elit, " +
        "sed do eiusmod tempor incididunt ut labore et dolore magna " +
        "aliqua. Ut enim ad minim veniam, quis nostrud exercitation " +
        "ullamco laboris nisi ut aliquip ex ea commodo cosnsequat. " ;


            font.pixelSize: 25
            wrapMode: TextArea.Wrap
            readOnly: true
        }

        ScrollBar.vertical: ScrollBar { id: scrollBar }

        // up/down keys described here:
        // https://doc-snapshots.qt.io/qt5-5.8/qml-qtquick-controls2-scrollbar.html
        Keys.onUpPressed: scrollBar.decrease()
        Keys.onDownPressed: scrollBar.increase()

    }
}

Thanks for any help.

Upvotes: 1

Views: 801

Answers (1)

İbrahim
İbrahim

Reputation: 1021

I recommend like this for mobile applications:

ScrollBar.vertical: ScrollBar {
  id: scrollBar
  policy: ScrollBar.AlwaysOn
  interactive: false
}

You can see: policy and interactive props.

Upvotes: 0

Related Questions