Create ListView/ListModel from a vector of strings - qt

Question

Prologue
QAbstractListModel might be a solution, but I think it is a bit overkill for me ... not sure
Intro
I'm making a vector inside C++ to be accessible from within QML:
class MyClass : public QObject
{
Q_OBJECT
Q_PROPERTY(QVector<QString> items READ items WRITE setItems NOTIFY itemsChanged)
// ...
}
As I have tested, I can access my vector from within QML:
console.log("myClass.items >>> ", myClass.items) // Logs vector of strings
Question
On my QML UI, I intend to show a list of the strings inside the vector. I try to use ListModel and ListView but I don't know how to do it. Can anybody help?
ListModel {
id: myListModel
// How to compose my model here according to vector of strings
// i.e. myClass.items
}
ListView {
model: myListModel
delegate: {
// ... show the strings inside the vector
}
}
UPDATE
As suggested by #Amfasis and #mohabouje, I modified my code like this, but it is not working for some reason.
C++ side:
class MyClass : public QObject
{
Q_OBJECT
Q_PROPERTY(QStringList items READ items WRITE setItems NOTIFY itemsChanged)
//...
}
QML side:
Row {
ListView {
id: items
model: myClass.items // Directly connect to C++ string list
delegate: Text {
text: modelData // Strings are NOT displayed on QML UI
// Log of modelData shows it is empty
}
}
}
On QML I log myClass.items and I see my string list:
console.log("myClass.items >>> ", myClass.items)
// logs:
// qml: myClass.items >>> [item 0,item 1,item 2]
Finally Fixed
When setting or modifying items, I need to emit the modification signal otherwise it won't work:
m_items = /* set items here */;
emit itemsChanged(m_items); // This is required!

Answer 1

You should expose your class interface to the QML engine. In this case, you can replace your QVector<QString> by an QStringList.
class MyModel: public QObject {
Q_OBJECT
Q_PROPERTY(QStringList model READ model NOTIFY modelChanged)
...
};
If you take a look into the docs:
Models that do not have named roles (such as the ListModel shown below) will have the data provided via the modelData role. The modelData role is also provided for models that have only one role. In this case the modelData role contains the same data as the named role.
So, you should use the property modelData:
ListView {
model: mymodel.model
delegate: Text {
text: modelData
}
}
To expose your C++ class, take a look into this page.