Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Contributor
torsten_ktz
Posts: 13
Registered: ‎01-08-2013
My Device: Dev Alpha
My Carrier: Dev Alpha
Accepted Solution

Fill dataModel with CustomObjects and show in a ListView

Hey all,

 

i created a class with some properties. 

Now i want to add objects of this class to a DataModel and show the properties in a ListView.

 

A simple Example:

 

class CustomClass
{
   QString name;
   QString age;
   QString something;
}

 

I create the ListView in Qml, define listItemComponents.

 

ListView
{   
	id: list
	objectName: "list"
	
	dataModel: ArrayDataModel {}
				 
	listItemComponents:
	[
		ListItemComponent
		{          
			Container
			{   
				id: itemContainer
				
				Label { Text: itemContainer.ListItem.data.name }
				Label { Text: itemContainer.ListItem.data.age }
			}                           
		}
	]        
}

 

in c++, i use findchild to get the ListView.

 

Now the problem begins, i dont know how to get my objects into the datamodel.

You can only add QVariants to the model.

So i tried creating a QVariant and used its setValue() function to add my CustomClass object.

But when i start my app, i get the error: Unable to assign [undefined] to QString and no data is shown.

 

If i assign String(itemContainer.ListItem.data) to the Label.Text, is see the classname of my class, so the objects seem to be there.

 

I also tried defining the propertys as Q_PROPERTYS and used Q_DECLARE_METATYPE() but nothing helped.

 

Maybe someone has an idea what im doing wrong.

 

Gretings.

 

Please use plain text.
Contributor
chriske86
Posts: 43
Registered: ‎01-05-2013
My Device: Dev Alpha
My Carrier: Telenor Hungary

Re: Fill dataModel with CustomObjects and show in a ListView

Hi,

 

you have a lot ways to populate a listView from C++. I think the best you can do now is to read the cascades tutorial article about DataModels:

 

https://developer.blackberry.com/cascades/documentation/ui/lists/data_models.html

 

cheers,

chriske

--------------------------------------------------------------
If my post was helpful or it was the solution for Your problem, please don't forget to give me a like, and mark my post as a solution. Thanks!
Please use plain text.
Contributor
chriske86
Posts: 43
Registered: ‎01-05-2013
My Device: Dev Alpha
My Carrier: Telenor Hungary

Re: Fill dataModel with CustomObjects and show in a ListView

Here is an official BB example, it uses the type of custom c++ list item component what you want:

 

https://developer.blackberry.com/cascades/documentation/device_comm/networking/tutorial_http_comm.ht...

--------------------------------------------------------------
If my post was helpful or it was the solution for Your problem, please don't forget to give me a like, and mark my post as a solution. Thanks!
Please use plain text.
Contributor
torsten_ktz
Posts: 13
Registered: ‎01-08-2013
My Device: Dev Alpha
My Carrier: Dev Alpha

Re: Fill dataModel with CustomObjects and show in a ListView

Hey chriske,

 

thans for your answers.

 

I've read the articles about Datamodels.

 

I don't want to group items and i dont have an xml structure.

So i could use ArrayDataModel, but i cant add my data (CustomClass) to this DataModel because its no QVariant.

 

I used Q_DECLARE_METATYPE(CustomClass); and QVariant::fromValue(customObj) to fill the ArrayDataModel with my objects.

 

If i now assign the ListItemData to a Label.Text property, it shows CustomClass as Text.

But if i assign ListItemData.name to it, i get "Unable to assign [undefined]".

 

Maybe i'm missing something

Please use plain text.
Contributor
chriske86
Posts: 43
Registered: ‎01-05-2013
My Device: Dev Alpha
My Carrier: Telenor Hungary

Re: Fill dataModel with CustomObjects and show in a ListView

[ Edited ]

Hi,

 

I have a solution for you. I've created a simple class:

 

class CustomElement : QObject {

	Q_OBJECT

public:
	CustomElement(QObject* parent);
	virtual ~CustomElement();

	QString getCode();
	QString getName();

	void setCode(QString aCode);
	void setName(QString aName);


private:
    QString code;
    QString name;
};

Added a listView to QML:

 

ListView {
            objectName: "list"
           listItemComponents: [
                   ListItemComponent {
                      //type: "listItem"
            
                       Container {
                           id: itemRoot    
                           Label { text: ListItemData.code }
                           Label { text: ListItemData.name }
                       }
                   }
               ]
        }

 And defined the look of the list items with ListItemComponent. A single list item contains 2 Labels. One for code and one for name.

 

On C++ side, I initialize first a QList from CustomElement* .

 

In header:
QList<CustomElement*> list;

In cpp:

for (int i = 0; i < 20; i++)
	{
		CustomElement* element = new CustomElement(this);
		element->setCode(QString::number(i));
		element->setName("name " + QString::number(i));

		list << element;
	}

 And the here comes the "magic". If you don't want to use Q_Properties, the best option you have is QVariantListDataModel. You can assign this class to the listView's model directly. Definition:

 

#include <bb/cascades/QListDataModel>

bb::cascades::QVariantListDataModel listModel;

 You must fill this object with QVariantMap objects. I'll show you how to do this:

 

QVariantMap map = QVariantMap();

    for (int i = 0; i < 20; i++)
    {
    	map["code"] = list.at(i)->getCode();
    	map["name"] = list.at(i)->getName();

    	listModel << map;
    }

    ListView* listView = root->findChild<ListView*>("list");

    listView->setDataModel(&listModel);

This code-snippet is started after this lines:

// set created root object as a scene
    app->setScene(root);

 So, QVariantMap can hold the name of a property, and it's value too.

 So, filling with data is very simple. 

 

I've tested it, and works like a charm :smileyhappy:

 

--------------------------------------------------------------
If my post was helpful or it was the solution for Your problem, please don't forget to give me a like, and mark my post as a solution. Thanks!
Please use plain text.