Not-Operator for data binding

It often happens that there is a pair of icons on my UI the visibility of which is mutually exclusive. A typical example is the pair (edit icon / save icon). When steering the icon visibility with data binding, I’m using the page data property readMode to bind to the edit icon and set it to true or false as required. However, I have to bind the save icon to another property and make sure that it’s the inverse of the property bound to the edit icon.

My suggestion is: allow to express a NOT operation when defining data bindings. You might allow the !-operator from JavaScript, or something else. Then, binding for the visibilty of the save icon would just be !readmode

Regards

Hello @Klaas_Klever

Thank you for your suggestions, we appreciate that.

I will offer that to my colleagues, and we will discuss it.

Only one thing i must make clear - data binding and handlers it’s quite complex logic, and this feature not so easy as we can imagine at first sight.

I will notify you If that was implemented.

Regards, Dima.

Hi Klaas,

As a workaround I suggest using one icon (the Icon component) and depending on the state of the app use the Icon logic to return the icon you need:

Regards,
Mark

Hi Mark,
Great suggestion. In my case I have to deal with a 3rd icon, the cancel icon, which has the same visibility as the save icon.
Thanks and regards,

Hi @Klaas_Klever!
I had the same need, specifically to alternate icons on the click.
I did it like this:


“cronologiaSwitch” in my case allows you to alternate the icons, in the “onPageEnter” event of the page it was declared = 1 then in the onClick event of the icon itself I set the logic you see above.
I think that with the help of some control variable you might be able to have some positive results.
(“cronologiaIcon” is the data binding property name of “Icon Logic” section that Mark displayed above obv)

I hope I was helpful,
Marco

Thank you! Very helpful.