Tool [B4X] MaterialIcons Web Font Chooser

Erel · Mar 21, 2019

This is an icon chooser tool for the MaterialIcons Web font: https://github.com/Templarian/MaterialDesign-Webfont
This font includes 3595 icons. The built-in material icons font includes about 800 icons.

Click on an icon to copy it to the clipboard. There are two options:

1. Copy with Chr() - this should be used when using the icon in B4J code, B4i code or B4A code.
2. Copy directly - this should be in B4A designer after you set the font:

As you can see the icon will appear as an empty square in the IDE, however it will work.

You can change the icons color in the chooser. This only affects the icons as they are displayed in the chooser.
Example project with the chooser: www.b4x.com/b4j/files/WebFont.zip

The font itself is attached.

Erel · Mar 21, 2019

The chooser source code is attached.

Erel · May 26, 2021

B4XPages project with designer + code usage of this font: www.b4x.com/b4j/files/WebFont.zip
The chooser is opened with a clickable comment link.
Note that in B4i the font file is put in Files\Special and the font is added with #AppFont in the main module.

Mashiane · May 29, 2021

Not relevant but just thinking how cool it would be perhaps in the near future having an app that you can run like that and it will perform tasks on the source code in your code module. #WishfulThinking

ivan.tellez · Oct 4, 2022

It works with the Font Awesome PRO changing the font file and the txt file with the char list

Erel said:
As you can see the icon will appear as an empty square in the IDE, however it will work.

I also try this with the IDE, replacing the txt list in the B4A folder and the B4X_FontAwesome.otf with the PRO one, but the picker does not show the glyps:

Is there a way to show the PRO version glyps on the IDE?

Erel · Oct 6, 2022

ivan.tellez said:
Is there a way to show the PRO version glyps on the IDE?

Currently no.

yiankos1 · Nov 15, 2023

Hello Erel,

I would like to add the updated version of this font but i can't understand how did you created the txt file? I think that you took all data from this file https://github.com/Templarian/MaterialDesign-Webfont/blob/master/scss/_variables.scss and then what?

Erel · Nov 16, 2023

The first character on each line is the actual icon character.

You can build it from the scss file (I don't remember whether I used that file or a different one).
Parse the hex value and use Chr(ParsedValue) for the first character on each line.

Tool [B4X] MaterialIcons Web Font Chooser

Attachments

Erel

B4X founder

Attachments

Erel

B4X founder

Mashiane

Expert

ivan.tellez

Active Member

Erel

B4X founder

yiankos1

Well-Known Member

Erel

B4X founder

Similar Threads

Tool [B4X] MaterialIcons Web Font Chooser

Attachments

B4X founder

Attachments

B4X founder

Expert

Active Member

B4X founder

Well-Known Member

B4X founder

Similar Threads

Privacy & Transparency

Privacy & Transparency