ListView and system scrollbar

stibi

Hi,
it is possible to use standard Qt/System scrollbar with ListView in QDeclarativeView widget (C++ application) ?
I already checked QML solution of scrollbar (https://bitbucket.org/gregschlom/qmlscrollbar/src/tip/ScrollBar.qml) but classic scrollbar would be better :)

Thanks a lot for help!

ngocketit

If I understand correctly, you want the scrollbar to have system style instead of the one with custom images, colors etc, right? If that's true then you can create your own scrollbar component with native style in QML by subclassing the QDeclarativeItem and use QStyleOption and QStyle to do drawing. Not so sure but this link may be a good start for you: http://qt-apps.org/content/show.php/Native+Quick+Widgets?content=137145

mohsen

do you mean you want to scroll whole QML object which is loaded in QDeclarativeView by scrollbars? If yes, since QDeclarativeView resizes automatically when a qml file has loaded, you can make it scrollable by place it in a QScrollArea object.

DenisKormalev

Also you can create object from QDeclarativeComponent and put into QGraphicsView. It will allow you to add system scroolbar.

stibi

Hi guys, thanks a lot for help.

ngocketit: I didn't know about these Native widgets, great thing, thanks!

mohsen: That sounds great for me, at least for now. But probably I did something wrong :)

little example from my code:

@
MainWindow::MainWindow(QWidget *parent) :
QMainWindow(parent),
ui(new Ui::MainWindow)
{
ui->setupUi(this);

twitterApi = new TwitterAPI;
NativeQuickWidgets::qmlRegisterTypes();

this->model = new TimelineModel(new TimelineItem, this);

QDeclarativeView *timelineView = new QDeclarativeView(this);
timelineView->setResizeMode(QDeclarativeView::SizeRootObjectToView);
timelineView->rootContext()->setContextProperty("timelineModel", this->model);
timelineView->setSource(QUrl("qrc:/TimeLineView.qml"));

QScrollArea *scrollArea = new QScrollArea();
scrollArea->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOn);
scrollArea->setWidget(timelineView);

ui->horizontalLayout_2->addWidget(scrollArea);

@

This is what i got: http://twio.cz/adaz

With "scrollArea->setWidgetResizable(true);" are listview items painted correctly, but scrollbar don't work correctly (it's disabled) : http://twio.cz/adb0

I noticed that QDeclarativeView has settings for QAbstractScrollArea, that sounds promising. But with "ResizeMode QDeclarativeView::SizeRootObjectToView" is scrollbar disabled again.

With "ResizeMode SizeViewToRootObject" scrollbar works great, but this settings has really bad impact on all others :D http://twio.cz/adb1

I think there is needed some changes in my ListView QML component…

I know it's hard to "guess" what is wrong without context of rest of code, but any clue might help me, thanks!

stibi

One problem solved.

with setResizeMode(QDeclarativeView::SizeViewToRootObject); -->
Top level QML object (Rectangle for example), must have a set some width and height.
Height should be set as ListView.contentHeight and voila, scrollbar is up and ready :)

But, it would be really better if RootObject automatically adjusted to size of window :)

stibi

With knowledge of contentWidth/Height I was able to use ScrollArea from Native Widgets:

@
import QtQuick 1.0
import NativeQuickWidgets 1.0
import "qrc:/nativequickwidgets"

Rectangle {
SystemPalette { id: myPallete; colorGroup: SystemPalette.Active }
color: myPallete.window

ScrollArea {

    width: parent.width
    height: parent.height
    autoFillBackground: false
    contentWidth: myItemsView.contentWidth
    contentHeight: myItemsView.contentHeight
    horizontalScrollBarPolicy: Qt.ScrollBarAsNeeded
    verticalScrollBarPolicy: Qt.ScrollBarAlwaysOn


    ListView {
        id: myItemsView
        anchors.fill: parent
        spacing: 5
        model: timelineModel
        delegate: MyItem{}
    }
}

}
@

http://twio.cz/adbb

But, new problem appeared here, with this case, mouse scroll wheel doesn't work :D Definitely not boring here :)