Can I pass a variable into Qml?

[franziss]

I have a qml file icon.qml, as shown below.

@
Image {
id: icon
width: 64
height: 64
source: image

MouseArea {
    id: iconMouseArea
    anchors.fill: parent
    width: 64
    height: 64

    drag.target: parent
    drag.axis: Drag.XandYAxis
}

}
@

Is it possible to pass a variable image into icon.qml? So that when I instantiated icon.qml, I can pass any image into icon.qml, and display that image? Thank you for your help. =)
@
var iconObj = Qt.createComponent("icon.qml");
iconObj.createObject(parent);
@

[Chuck Gao]

Of course you can :) You can search the keyword "property binding" in help document.

[apap_]

you can do this :
@
var component = Qt.createComponent("icon.qml");
var object = component.createObject(parent);
object.source = image;
@

Take a look to this doc : "http://doc.qt.nokia.com/latest/qdeclarativedynamicobjects.html":http://doc.qt.nokia.com/latest/qdeclarativedynamicobjects.html

[thisisbhaskar]

I had a doubt if
@object.source = image;@ works. Generally 'object' is the id we give inside the qml element. Good to know that it works.

One more thing is we can pass properties to created object in createObject call itself.

object = component.createObject(parent, {"x": 100, "y": 100});

[apap_]

@Vijay : in fact you can set the properties directly in createObject(), but it's only available from QtQuick 1.1 ;-)

[franziss]

Dear all,

Thank you very much for your help, I tried apap_ solution, and it works great. I tried Vijay solution, but it doesn't work for QtQuick 1.0

For apap_ solution, can I pass as
@
object.imageName = "a.jpg"
@

then in icon.qml,

@
property var imageName
image: imageName
@

It there any mistake in my syntax? Thank you.

[apap_]

when you declare a property in a qml element, you have to specify his type :
@
property string imageName: "defaultImage.jpg"
@
and you should initialize your property to a default value. I think that without initialization, you should get an error when you create your object because imageName will be undefined.

[franziss]

Hi apap_

This is so cool, thank you so much for your help. :)

[franziss]

Hi Guys,

I realised that we cannot dynamically assigned id to the dynamically created object.
http://doc.qt.nokia.com/4.7-snapshot/qdeclarativeintroduction.html

@
var iconObj = Qt.createComponent("icon.qml");
var object = iconObj.createObject(parent);
object.id = "hello";
@

And I understand that we cannot get qtquick 1.1, so we cannot do this

@
object = component.createObject(parent, {“id”: "hello"});
@

Do you have any suggestions to overcome this problem. Thank you very much for your help!

[thisisbhaskar]

In this case you should assume object as id, because that is what you use to refer to the members of created object. Can you let me know the use case where you need to add an id to the dynamically created object.

[franziss]

Hi Vijay,

Thank you for your help. I have a button, which when pressed, will create an object. This object is actually a slide (if you think of it as a power point slide kind of thing), which I use qml rectangle to represent. So I am trying to give each slide an id, which is in this way: slide1, slide2, .... sliden

[thisisbhaskar]

Ok.. I understand the use case now. Now, in this case it makes sense to be able to give id to dynamically created item. But seems not possible.

One way to solve is to have a list array ( Don't know syntax of list/array in JavaScript), and keep appending your slides to it. You can refer to them later with list index.

Sorry for not being able to give you proper solution. But hope this helps.

[franziss]

Hi Vijay,

Thank you for your suggestion. Will QtQuick 1.1 support dynamic instantiation of id?