- Icon
🧬 Assemble components
Icon
ContributeWhat is Icon?
The Icon component in ILLA Cloud is a powerful feature that allows users to enhance the visual appeal and functionality of their applications. With the Icon component, users can easily add icons from popular icon libraries to their user interfaces, providing a more intuitive and engaging experience for their users.
Properties
| Properties | Description |
|---|---|
| Icon | allows users to easily select an icon from a predefined set of options |
| Event Handler | Trigger queries, control components, or call other APIs in response to component events. |
| Tooltip | Users can enter the component tooltip here. The tooltip will be shown when it is focused. Markdown format is supported. |
| Hidden | Dynamically control whether the component is hidden. You can change the hidden status through a dynamical boolean value. |
| Theme Color | Allows users to specify the button’s background color and opacity |
Event handler
| Event | Description |
|---|---|
| Click | When a user click this icon, perform specific action customized by users. |
Data
The component has some commonly used data, which can be called via {{componentName.propertyName}} in the app.
| Property name | Description |
|---|---|
| colorScheme | stroke color of the icon |
| displayName | the name of this component (ie icon1) |
| events | generated or triggered when certain actions or events occur within the component. |
| hidden | hidden status (true or false) |
| iconName | the label name for icon |
| tooltipText | value of tooltip text |
Example: {{icon1.iconName}}
Use case
Below are some examples of icons we offer:
- Flat Color Icons:
- Simple Line:
- Tabler Icons:
- Bootstrap Icons:
