Search code examples
qtqmlqt-quickqt4.8

QtQuick 1.1 Floating Rectangles


I'm using QtQuick 1.1 with Qt 4.8 on an embedded Linux Plattform. I have somekind of Desktop where dynamically created Rectangles are arranged in a Grid - this Grid is inside a Flickable.

Flickable{
  anchors.fill: parent
  contentHeight: homegrid.height
  flickableDirection: Flickable.VerticalFlick
  clip:true
  Grid{
     anchors.left: parent.left
     anchors.top: parent.top
     columns: 4
     flow: GridView.LeftToRight
     id: homegrid
     //new items get pushed to this grid
  }
}

It looks like this:

enter image description here

When i create 2 more items, i push them to the end of the grid which looks like this:

enter image description here

Taht's my current State. But now i need to get categories in this Grid and i need to be able to push new items to each category. Should look like:

enter image description here

And after adding two items to the red category:

enter image description here

How can i arrange containers in a grid where the containers automatically break at the end of each row?

Solution:

  1. Using a GridView

GridView{ model: myDesktopModel delegate: HomeLinkeDelegate { id: homeLinkDelegate } }

  1. defining the list in c++

QList<QObject*> objectList;

The List can be sorted (by Colors).

  1. Register the List

viewer->rootContext()->setContextProperty("myDesktopModel",QVariant::fromValue(this->objectList));

When the List is modified, you have to register it again - than the GridView refreshes.

More information about GridView: http://doc.qt.io/qt-4.8/qml-gridview.html#model-prop

More information about QObjectList-based model http://doc.qt.io/qt-4.8/qdeclarativemodels.html#qobjectlist-based-model


Solution

  • As far as I know, you can't choose the position of items in a Grid from QML. You'd be better off using a GridView and creating your own custom QAbstractItemModel so that you can choose insert the items at the correct index in the model. Or, as @GrecKo mentioned, use a ListModel and call the insert() function.

    If you end up choosing the QAbstractItemModel approach, see Using C++ Models with Qt Quick Views for more information.