What is font awesome?
Font awesome is a icon library. You can use it to put visual icons inside your application.
Warning
If your application is running offline, icons will not show up. You should only use font awesome when the device has an internet connection.
Finding an icon
You can browse the font awesome icons here: https://fontawesome.com/icons. After finding an icon that you like, you will see a code snippet at the top of your screen, like the following:
Depending on which icon you choose, the code snippet will be slightly different. You only need to get the bold part, inside the speech marks. In this case, this is fas fa-adjust
. You will need to input this part of the code snippet into the property HTML - className
of the icon user interface component. After saving, the icon will show up.
Chaning the icons size
Again, we are going to use the icon fas fa-adjust
as an example. To make this icon two times larger, we need to replace this with fas fa-adjust fa-2x
Original | 2x | 3x |
---|---|---|
Changing the icon using blocks
In this example, when the user clicks on a button, an event is fired and the icon will change. You will need to change this example so that is specifies the icon component that you wish to change and so that it changes it to the icon that you want.