How to configure FAVOURITE element in vFlow?

How to configure FAVOURITE element in vFlow ?

  1. Navigate to the Component tab and click on the Add Component button to open the component list.
  2. Select the FV component from the list.
  3. Enter basic details, select the appropriate properties, select template 3 or 4 in the UI properties section and submit the component.
  4. Navigate to the Element tab and click on Add Elements button to open the Elements list.
  5. Select the Favourite Element from the list.
  6. Enter the appropriate icon name from google fonts in the Element Name section which is to be displayed as favourite icon. (Choose any icon from Material Symbols and Icons - Google Fonts which is present in outlined icons as well as filled icons. For eg. ‘grade’, ‘thumb_up’, ‘bookmarks’, ‘label’, etc)
  7. Define a key with boolean values in the datasource of the FV component.
  8. If the value is true then the favourite icon will be seen as filled and if the value is false the icon will be unfilled.
  9. When you click on the outlined icon whose value is false, it will be changed to filled with value as true and vice versa.
  10. To change the color of the icon, open Favourite element, go to UI properties, Data Style and set Font color as any color of choice.
1 Like