Model views with pagination

Mark81

I'm looking for the best way to create a grid-based view with pagination.
My model contains several items, and I want to display only N for each page.

I wonder what is the best approach to do this!

p3c0

@Mark81
What do you mean by grid-based view ? i.e root Item will be a GridView ?
Perhaps some more info would be useful. A pictorial representation would be better.

May be a ListView with horizontal orientation and GridView as its delegate and resizing the delegate to fill the viewport ?

Mark81

@p3c0 I mean the items should be placed into a grid, with fixed rows and columns.
The classical example is the thumbnails view. One catched from Google Pictures:

https://www.codester.com/static/uploads/items/200/preview/screenshot-1.jpg

as you see the items are placed into a grid (2 rows, 5 columns) but you can change the page to view other items. I'm not interested into the page numbers, I'm going to use the PageIndicator QML Type.

I think it's a very simple and common task, but I cannot find a code example. Perhaps I'm using the wrong key-words.

p3c0

@Mark81 IMO ListView with horizontal orientation and GridView as its delegate and resizing the delegate to fill the viewport ? ListView and GridView both supports models.

cheezus

@Mark81 You've got two models in play: a "page" and the actual data. So you want to create a paginated model instead. There is nothing in Qt that will make this easy for you otherwise, afaik.

Mark81

Because it seems a very common task (at least in javascript) I was hoping there is a ready-to-use QML Type. Instead I need to write some code, no problem though!

@p3c0 I think I understand your hint. I should set my whole model to both ListView and GridView. Then I should position the view of the GridVIew (used as delegate) to show the correct "page" of my model.

@cheezus IMO I don't need two models. I mean, the data set is the only model, while the pagination should be achieved by hand. Or I don't understand what you're saying?

cheezus

@Mark81 Even in JavaScript you have two models, you just don't typically think of it that way: model 1: the database, model 2: the results on the client side.

Here, you have two models: 1 - the database, 2 - the QML side.

So what you need to do is create a paginated model using LIMIT/OFFSET queries.