In WaveMaker, widgets can display icon for Panel, Button, and more. You can choose the icons from the list of wavicons or font-awesome icons. You can use glyph icons, available here.
You can change the color of an icon based on a condition. In the following example, see how to change the Icon color based on ckeching a Checkbox.
- Drag and drop an Icon and a Checkbox widget.
- For the Checkbox widget, set the
unchecked valueas true and false respectively.
- Click on the Icon widget and for the "Icon Class" property click on the bind icon.
- Enter the expression as below.
<glyph class name>" + " " + (Widgets.<checkbox_name>.datavalue?"first_calssname":"second_classname")
In this example the expression,
text-info are the in-build classes of the product which we used to set the color. You can use your own class (defined in the css file) to set the color property.