How to reset the value of an input widget after the widget state is changed

[Ethanwolfie]

Bindings of values of input widgets break when the state of the widget changes. I'm trying to implement a number input widget using the LineEdit widget, the initial value binds to some global value. But after the input text has changed, if I'm trying to reset the global value, the property binding doesn't work anymore. Is there a recommended way or workaround for the LineEdit widget to automatically get updated to the new global value after the property binding is broken? Or do I have to create a callback in the root object and call the callback to manually reset the value everytime the global value is changed, which I think is rather cumbersome.

[Ethanwolfie]

export global Global {
    in-out property <int> number;
    callback parse-to-int(string) -> int;
}
export component SomeWidget inherits Window {
    // callback set-input-number(string);
    // set-input-number(value) => {
    //     le.text = value;
    // }
    le := LineEdit {
        text: Global.number;
        edited(value) => {
            Global.number = Global.parse-to-int(value);
            self.text = Global.number;
        }
    }
}

[FloVanGH]

We had a similar situation with the SpinBox widget. You can check the code how it could be solved

slint/internal/compiler/widgets/fluent-base/spinbox.slint

Line 70 in d5d772d

i-text-input := TextInput {

.

There is a update-value function that is use to override the current value, after that it also updates the text of the TextInput. I hope that helps you. If you have further questions, just feel free to ask.

[Ethanwolfie]

Thanks for the explanation. I think this works if all the updating logic is encapsulated in the widget itself. But in my situation, I need to reset the value to some initial value from the rust side through global singletons or in some other part of the slint code, which does not work nicely if the editing breaks the property binding. I did some testing using the SpinBox widget. Here's the code.

export component TestWindow inherits Rectangle { 
    VerticalBox {
        sb := SpinBox { 
            minimum: 0;
            maximum: 100;
            value: 10;
        }
        txt := Text {
            text: sb.value;
        }
        Button {
            text: "reset";
            clicked => {
                sb.value = 50;
            }
        }
    }
}

And here is the screen capture.

2023-07-19.17-53-40.mp4

As can be seen in the captured video, the property binding of the text to the SpinBox value breaks after the increment button or decrease button is clicked and the update-value function is called, so the SpinBox value reset won't be reflected in the text input field. Another problem is that the SpinBox value is not set to the edited value, I'm experiencing this problem both using slint-viewer and in the compiled application, and even on the online documentation page. Is there a plan for creating property bindings in code like Qt.binding in QML? Maybe this will solve the problem?

[ogoffart]

We indeed need to find a solution to do that cleanly.

One thing would be to add changed callback: #112
But we probably also need more smart two way bindings #814 (comment)

But it seems that this will be hard to do without changed callback.