<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0"><channel><title><![CDATA[How to create dynamic bindings in ListModel?]]></title><description><![CDATA[<p dir="auto">In small example below, I'm trying to create rectangles whose <code>width</code> depends on <code>foo</code>. As we all know, we cannot use property binding in <code>ListElement</code> because <code>ListElement</code> doesn't allow to use script for property value.</p>
<pre><code>import QtQuick 2.0
import QtQuick.Controls

Window {
    width: 400
    height: 300
    visible: true
    property int foo: 10

    ListModel {
        id: listModel
        // ListElement {
        //     width: foo // error: ListElement: cannot use script for property value
        // }
    }

    Row {
        anchors.top: parent.top
        Repeater {
            id: repeater
            model: listModel

            delegate: Rectangle {
                width: model.width
                height: 50
                color: "green"
            }
        }
    }
    Button {
        text: "add item"
        anchors.top: parent.top
        anchors.horizontalCenter: parent.horizontalCenter
        onClicked: {
            listModel.append({
                                 "width": foo // works, but is not a binding
                             })
        }
    }
}

</code></pre>
<p dir="auto">In order to use script, I have to try to <code>append</code> in function. However, in this way, if <code>foo</code> is changed somewhere, the <code>width</code> of rectangles won't change accordingly. So anyone knows a better solution?</p>
]]></description><link>https://forum.qt.io/topic/146241/how-to-create-dynamic-bindings-in-listmodel</link><generator>RSS for Node</generator><lastBuildDate>Thu, 05 Nov 2026 11:50:23 GMT</lastBuildDate><atom:link href="https://forum.qt.io/topic/146241.rss" rel="self" type="application/rss+xml"/><pubDate>Wed, 05 Jul 2023 06:16:47 GMT</pubDate><ttl>60</ttl><item><title><![CDATA[Reply to How to create dynamic bindings in ListModel? on Fri, 07 Jul 2023 09:17:43 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/grecko">@<bdi>GrecKo</bdi></a> Well, here is the thing. I'm writing a custom title bar, which enables users to add new buttons. I use <code>Repeater</code> whose model is a <code>ListModel</code> to generate buttons. In order to specify behaviors of <code>onClicked</code>, <code>onContainsMouseChanged</code> and <code>onContainsPressChanged</code>, I also maintain a list of <code>object</code> called <code>callbacks</code> in <code>Repeater</code>. When I intent to add maximize/restore button</p>
<pre><code>title.appendButton({
    "name": "Maximize",
    "icon": "qrc:/icons/maximize.svg",
    "visible": Boolean(titleButton &amp; ShadowWindow.TitleButton.Maximize),
    "tooltip": "Maximize"
    }, button =&gt; {
        button.icon.source = Qt.binding(() =&gt;  control.visibility === Window.Maximized ? "qrc:\icons\restore.svg" : "qrc:\icons\maximize.svg")
        button.toolTip.text = Qt.binding(() =&gt; control.visibility === Window.Maximized ? "Restore" : "Maximize")
        if (control.visibility === Window.Maximized)
                  control.showNormal()
        else
                  control.showMaximized()
        })
</code></pre>
<p dir="auto">As you can see, I set <code>Qt.binding</code> in <code>onClicked</code>.  Do you think it is a good way to set <code>toolTip.text</code> and <code>icon.source</code> directly in <code>onClicked</code>?  Like this</p>
<pre><code>if (control.visibility === Window.Maximized) {
    button.toolTip.text = "Maximize"
    button.icon.source = "qrc:/icons/maximize.svg"
    control.showNormal()
} else {
     button.toolTip.text = "Restore"
     button.icon.source = "qrc:/icons/restore.svg"
     control.showMaximized()
}
</code></pre>
<p dir="auto">Besides, I still have a problem. I encapsulated a series of initialization in the <code>init()</code> function. Due to uncertainty of order of <code>Component</code> completion, I have to make user call <code>init()</code> at the beginning of their <code>Component.onCompleted</code>, do you have a better solution?</p>
]]></description><link>https://forum.qt.io/post/763979</link><guid isPermaLink="true">https://forum.qt.io/post/763979</guid><dc:creator><![CDATA[Kamichanw]]></dc:creator><pubDate>Fri, 07 Jul 2023 09:17:43 GMT</pubDate></item><item><title><![CDATA[Reply to How to create dynamic bindings in ListModel? on Wed, 05 Jul 2023 16:30:25 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/kamichanw">@<bdi>Kamichanw</bdi></a> <a href="https://doc.qt.io/qt-6/qml-qtqml-models-listmodel.html#get-method" target="_blank" rel="noopener noreferrer nofollow ugc">https://doc.qt.io/qt-6/qml-qtqml-models-listmodel.html#get-method</a></p>
<blockquote>
<p dir="auto">Warning: The returned object is not guaranteed to remain valid. It should not be used in property bindings.</p>
</blockquote>
<p dir="auto">for the icon you can do a declarative binding, no need for <code>Qt.binding</code>.</p>
<p dir="auto">Without more context we can't really help you. The code you pasted is not something that I would find good.</p>
<p dir="auto">When is foo modified and why can't you modify the model instead?<br />
If you don't want that to be in a model why don't you bind to <code>width: foo</code> in your delegates instead?</p>
]]></description><link>https://forum.qt.io/post/763728</link><guid isPermaLink="true">https://forum.qt.io/post/763728</guid><dc:creator><![CDATA[GrecKo]]></dc:creator><pubDate>Wed, 05 Jul 2023 16:30:25 GMT</pubDate></item><item><title><![CDATA[Reply to How to create dynamic bindings in ListModel? on Wed, 05 Jul 2023 16:01:16 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/grecko">@<bdi>GrecKo</bdi></a> Your point is so elegant, especially when we need to change a lot of data in <code>ListModel</code>, but I still have some scenarios that make me have to change <code>ListModel</code> slightly and in low cost. For example, when I develope a maximize/restore button on title bar, I hope the icon url can be changed dynamically according to the <code>visiblity</code> of <code>Window</code>. My solution is use <code>Qt.binding()</code> in js funcion.</p>
<pre><code>icon = Qt.binding(() =&gt; wnd.visibility === Window.Maximized ? "qrc:/icons/restore.svg" : "qrc:/icons/maximize.svg")
</code></pre>
<p dir="auto">For the scenario in the question, we can</p>
<pre><code>// other code...
    Button {
        text: "add item"
        anchors.top: parent.top
        anchors.horizontalCenter: parent.horizontalCenter
        onClicked: {
            listModel.append({
                                 "width": foo
                             })
            listModel.get(0).width = Qt.binding(() =&gt; return foo)
        }
    }
// other code...
</code></pre>
]]></description><link>https://forum.qt.io/post/763725</link><guid isPermaLink="true">https://forum.qt.io/post/763725</guid><dc:creator><![CDATA[Kamichanw]]></dc:creator><pubDate>Wed, 05 Jul 2023 16:01:16 GMT</pubDate></item><item><title><![CDATA[Reply to How to create dynamic bindings in ListModel? on Wed, 05 Jul 2023 11:38:38 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/kamichanw">@<bdi>Kamichanw</bdi></a> My first instinct would be to not do that.</p>
<p dir="auto">The philosophy I adhere to when thinking about QML is that the QML objects are a representation of my data, and a way to interact with it. They are not my data.</p>
<p dir="auto">In your case what does the width of your rectangle represents?</p>
<p dir="auto">Some time ago I had to develop a UI editor in QML, in this case the state of the UI and where elements were placed was my data.<br />
It was provided as a model and represented by Rectangle delegates.<br />
The delegates where placed according to the model data and when I resized a Rectangle it actually modified the underlying data and the delegate would then update. I never modified my QML items directly, everything was in a model.</p>
<p dir="auto">Here's a video of its PoC : <a href="https://gfycat.com/scholarlythosefly" target="_blank" rel="noopener noreferrer nofollow ugc">https://gfycat.com/scholarlythosefly</a></p>
]]></description><link>https://forum.qt.io/post/763696</link><guid isPermaLink="true">https://forum.qt.io/post/763696</guid><dc:creator><![CDATA[GrecKo]]></dc:creator><pubDate>Wed, 05 Jul 2023 11:38:38 GMT</pubDate></item><item><title><![CDATA[Reply to How to create dynamic bindings in ListModel? on Wed, 05 Jul 2023 11:14:58 GMT]]></title><description><![CDATA[<p dir="auto"><a class="plugin-mentions-user plugin-mentions-a" href="/user/kamichanw">@<bdi>Kamichanw</bdi></a> you could use <code>setProperty</code> to update your model values. Do this in a function that you call from a <code>on&lt;Property&gt;Changed</code> handler or use a <code>Connection</code>, whatever makes more sense for your use case.</p>
]]></description><link>https://forum.qt.io/post/763693</link><guid isPermaLink="true">https://forum.qt.io/post/763693</guid><dc:creator><![CDATA[Bob64]]></dc:creator><pubDate>Wed, 05 Jul 2023 11:14:58 GMT</pubDate></item></channel></rss>