I have two buttons(expand and collapse), both of which are shown on the basis of a particular condition. Now, i want to modify the behavior like : On click of expand button, expand button should hide and collapse should be displayed and vice-versa. Something like tree expander button which goJs provides.
How can i do that ?
Bind either their “visible” property or their “opacity” property to some property that you have that represents the state the node is in, with opposite conversion functions returning either true/false or 0.0/1.0.
You first need to decide whether to control the buttons’ visible or opacity property. Choose one – it does not make sense to bind both of them for your requirements. Your choice of property affects panel layout as a button shows or hides.
Second, the bindings should use the same source property. You’ve done that, although I do not understand why you used two different data properties.
Third, the conversion functions should return opposite values so that one button shows when the other one is hidden.