Important: Please read the Qt Code of Conduct -

[SOLVED] Binding from javascript

  • I create an item dynamically in js and my question is how can I set binding for that item?

    I tried following way, but to no avail:

    @var newLine = Qt.createQmlObject('import QtQuick 1.0; import Lines 1.0; Line {/.../}', rootScene)
    var newBinding = Qt.createQmlObject('import QtQuick 1.0; Binding {}', newLine) = newLine = "startingPoint"
    newBinding.value = Qt.point(node.x, node.y)@

    It SETS the value properly, but when node's position changes, my line doesn't update.

    What's the correct way, if this is not?

  • You best establish the property bindings from QML. You know that you can instantiate your QML components simply by <code>componentId.createObject(<parent>)</code>?

  • Property binding in JS will be available in Qt 4.7.4. See

  • I wasn't aware that I could do property bindings in JS.
    I'm impressed how QML/JS is evolving!

  • [quote author="minimoog77" date="1302971106"]Property binding in JS will be available in Qt 4.7.4. See[/quote]

    That's it, is there any chance for me to get current version of qt 4.7.4 (especially QtQuick 1.1) now?

  • Fenix, I think you can use Qt from "gitorious": in branch 4.7 (or maybe use master if you want even more experimental features).

  • QtQuick 1.1 was just recently merged into the Qt 4.7 master. You always get the bleeding edge from the "staging area": (e.g. try branch "qtquick11-stable").

  • Thank you, I compiled qtquick11-stable clone, but it didn't help; I found other workaround, though - if someone would have similar problem (with dynamically created bindings of dynamically created items):

    *Firstly I created js stateful lib with declared two variables and assigned some objects to them (no matter what they were, just couldn't be nulls):

    @var firstHook = someExistingObject1
    var secondHook = someExistingObject2@

    *Next I created a wrapper component with my custom Line element including mentioned lib with properties 'startingPoint' and 'endingPoint' binded to these variables:

    @import QtQuick 1.0
    import Lines 1.0
    import "../../js/Curve.js" as CurveFunctions

    Line {
    id: line
    penColor: "red"
    penWidth: 2
    startingPoint: Qt.point(CurveFunctions.firstHook.x, CurveFunctions.firstHook.y)
    endingPoint: Qt.point(CurveFunctions.secondHook.x, CurveFunctions.secondHook.y)

    *Then I added two functions to my component which change values of those variables and simulated 1px move back and forth of previous binded objects, so properties could update properly:

    @ function setFirst(first) {
    CurveFunctions.firstHook = first
    someExistingObject1.x += 1
    someExistingObject1.x -= 1
    function setSecond(second) {
    CurveFunctions.secondHook = second
    someExistingObject2.x += 1
    someExistingObject2.x -= 1

    and it works. 'someExistingObjects' could have opacity 0.0, or be any accessible objects.
    I'm not proud of it, but I wasn't able to figure out some other solution.

Log in to reply