Grid behavior when there are too many items?
-
EDIT
I would delete this post if I could. Turns out my regular rectangle test was flawed. Both tests behave the same. The extra items just sort of "wrap around" so the 10th item just gets put over the 9th item.
I'm just trying to fully understand the Grid positioner. The docs explain that when you set the number of rows and don't have enough items you'll get zero width items. It's strangely silent on what happens when you have too many. As a test I created 10 rectangles and put them in a 3x3 grid (purposely creating more items than the grid can hold) and the first nine showed up. Fine, it looked at first like the extra items just aren't shown. Then I tried a similar testing using a repeater with images and left one of the rectangles in the grid.
@ Grid{
columns: 3
rows : 3Repeater{ model : 9 Image{ source :"balloon.jpg" width : 50 height : 50 } } Rect50{ color : "darkviolet" } }@
To my surprise, I have eight visible balloon images. The first cell of the grid has my last rectangle. Is having more items than a grid can hold simply undefined behavior or is this a bug?
!https://dl.dropboxusercontent.com/u/41770120/Grid.jpg(Image of grid)!
-
you have only 3 rows and 3 columns. You have 10 elements to display. Increase the number of rows or columns or reduce the items to 9. It may solve your problem. I will try this shortly.
Try this
@Rectangle {
height: 400
width: 400Grid{ anchors.fill: parent columns: 3 rows : 4 spacing: 2 Repeater{ model : 9 Rectangle{ //source :"balloon.jpg" width : 50 height : 50 color : "red" } } Rectangle{ height: 50;width: 50 color : "blue" } }
}
@ -
You seem to have missed the point. I edited the question to try to make what I'm asking even clearer.
-
This looks like a bug to me. If there are more items, it should clip the last item. It is odd that it starts putting the items at the top corner again.