Skip to content

Icon

🎨 Styles

  • Typography

  • Font size: size of the icon that appears on the icon element.

  • Appearance

  • Text color: select icon color in the icon element using the color picker.
  • Margins
  • Margin: you can specify how much space you want between the edges of the icon element with the screen or another elements.

βš™ Properties

  • Generic properties
  • Control name: you can add a name to the icon this could be the way to identify this element about another elements.
  • Enable skeleton loaders: this tool provides an indication to the user that something is coming but not yet available on the icon element.
  • Control is hidden: hide the icon element from the screen.

Info

The skeleton loader component provides a user with a visual indicator that content is coming/loading. This is better received than traditional full-screen loaders.

  • Specific Properties
  • Icon picker: select a custom icon for the icon element.
  • Enable icon badge: They allow icons display important data to the user in realtime. They might show how many users are online, a notification count, or the number of unread messages.
  • Background color: select the background color using the color picker.
  • Text color: select icon color in the icon element using the color picker.
  • Badge text: add ****any combination of letters, numbers, and symbols to the icon badge.

****πŸ‘† Events

  • On press: the on press event provide the capability to capture tapping gestures and display feedback when this gesture is recognized.

πŸ“ Writable Properties

  • Badge text
  • Style color