andreinitescu / IconFont2Code

Generate C# class with constant fields for the icons in your font
277 stars 37 forks source link

Characters with an underscore in their name will get a default IconXXX name #6

Closed jsroest closed 4 years ago

jsroest commented 4 years ago

It looks like individual fonts that have an underscore in their name will get a default name like IconXXX

See for example this font: https://github.com/jossef/material-design-icons-iconfont/blob/master/dist/fonts/MaterialIcons-Regular.ttf

It has two characters that I need (print and print_disabled): https://github.com/jossef/material-design-icons-iconfont/blob/master/dist/material-design-icons.css

  .material-icons.print:before {
    content: "\e8ad"; }
  .material-icons.print_disabled:before {
    content: "\e9cf"; }

The c# code result is:

public const string Print = "\ue8ad";
public const string Icon224 = "\ue9cf";

The expected result would be:

public const string Print = "\ue8ad";
public const string PrintDisabled = "\ue9cf";
andreinitescu commented 4 years ago

Using the .ttf and the .css you mentioned, I get this:

image

I do not get public const string Icon224 = "\ue9cf like you mentioned.

Did you select the CSS file using this button on the right: image

jsroest commented 4 years ago

I did not use the css file (maybe should have), just uploaded the ttf and clicked copy to clipboard.

andreinitescu commented 4 years ago

Let me know how it works for you, and if it does, please close the issue.

Does the CSS feature makes sense to you? Let me know if you have ideas of how to improve the tool. Thanks.

jsroest commented 4 years ago

The tool works great, and also when using the css file, it works as expected. But if you omit the css file then the behavior as I described happens.

You might improve the tool by parsing the names correctly when not using a css file. (And then I assume that the individual glyphs have names in the ttf file, but with underscores in them).

andreinitescu commented 4 years ago

@jsroest

I assume that the individual glyphs have names in the ttf file, but with underscores in them

Actually no, the font doesn't have glyphs with names, you can see it on the left side, there's a blank above the hex value (if the glyph name exists, it's being displayed):

image

It might be confusing that even though the font has no names for any of the glyphs, you could still see that some of the glyphs do get a name in the C# code: image

This is because of I have a mapping between some known fonts and their CSS/ijmap counterpart, like how I described here. I basically check in the list here if there's a match based on the font name, and if there is, I try to use the file from 'mappingUrl' field. The issue is, in the case of your font, that font is a fork of Google's Material Font and it's using the same name! ("Material Icons"), but the font is actually different. So the ijmap is from Google's font, but your font has a CSS...

I could probably think of another way to do the mapping (beside the name, maybe use the version too?) but it can become complicated since versions can change... Ideally the guy who forked from Google's font should had used another font name, because he created a different font.

jsroest commented 4 years ago

Great explanation!

You are right, I did assume there were names in the font because the only file I supplied was the font file and nothing else.

The problem with Google's material font is that google does not update it anymore. There are a lot of new icons in the material library, but the font file is not updated, so it is not complete. https://github.com/google/material-design-icons/issues/786

I think you should not make another way of doing the mapping, don't make it more complicated.

Maybe you could add some counters to the website:

Thanks, I learned something today!