search

unoplatform / uno

Open-source platform for building cross-platform native Mobile, Web, Desktop and Embedded apps quickly. Create rich, C#/XAML, single-codebase apps from any IDE. Hot Reload included! 90m+ NuGet Downloads!!
https://platform.uno
Apache License 2.0
8.88k stars 717 forks source link

Automated approach to maintaining glyphs #967

Closed ghuntley closed 4 months ago

ghuntley commented 5 years ago

I'm submitting a...

Current behavior

See https://github.com/nventive/Uno/pull/723#issuecomment-479035232

Expected behavior

See https://github.com/nventive/Uno/pull/723#issuecomment-479035232

Minimal reproduction of the problem with instructions

See https://github.com/nventive/Uno/pull/723#issuecomment-479035232

We could, but I would vote for some automated approach - like maintaining a SVG file of used glyphs and completely ditch the winjs symbol font as it has different glyph positions as well as it no longer matches the new MDL2 symbols. This will take more effort though, as there are quite a lot of glyphs and each must be remade manually. So it would make sense to maintain two fonts at first - the winjs as default and new "Uno MDL2 Assets" font winch we will slowly update with new glyphs as necessary. It will also be easier as it was quite painful to replace the glyph in winjs font, whereas creating a new font from a glyph SVG file is quite simple and quick.

Environment

Nuget Package:

Package Version(s):

Affected platform(s):

Visual Studio

Relevant plugins

MartinZikmund commented 5 years ago

I think http://fontello.com/ could help us as a starting point to generate SVGs from TTF

FrancoisM commented 5 years ago

Why generate SVG from ttf if you can use ttf? Isn't SegMDL2.ttf sufficient? The list of available icons is here.

MartinZikmund commented 5 years ago

I think the problem here is that MDL2 is licensed - so if we must create a custom Uno font which will be ours, but not particularly different from Segoe MDL2 as well. Or get Microsoft to give us license to use it directly :smile:

FrancoisM commented 5 years ago

Where did you see it was licensed? I can't really find the info. And would that mean the only font is licenced or the icons are as well? If the icons are licensed you cannot use them even as svgs or in another font you'd create. 🤔

MartinZikmund commented 4 years ago

This looks like a very nice, Windowsy new open-source icon font - https://icons8.com/articles/line-awesome-icon-font/?ref=producthunt

Line Awesome: Open-Source Icon Font with 1380+ Line Icons
Are you a fan of Font Awesome, but want more variety? Meet Line Awesome, a free open-source icon font made from 1380+ modern line icons. It's ready to use in one line of code.
kakone commented 4 years ago

This looks like a very nice, Windowsy new open-source icon font - https://icons8.com/articles/line-awesome-icon-font/?ref=producthunt

I like the appearance of these icons. I can try to do a new font with a mix of these icons and winjs icons (with correct positions). I had made a tool for that. It takes an xlsx file as input (that describes the source file and unicode of each icon, and the corresponding destination unicode), and it generates a new SVG font file. Here is a try with all SymbolIcon : unofont

Icons8 Blog
Line Awesome: Open-Source Icon Font with 1380+ Line Icons - Icons8 Blog
Are you a fan of Font Awesome, but want more variety? Meet Line Awesome, a free open-source icon font made from 1380+ modern line icons. It's ready to use in one line of code.
MartinZikmund commented 4 years ago

@kakone That sounds great! If you can do this, please match the icons with the Segoe MDL2 assets glyph positions (the winjs font currently in use has different positions than MDL2)

kakone commented 4 years ago

I did .ttf and .woff2 files by mixing winjs and Line Awesome icons, with the same glyph positions as Segoe MDL2. It is not ideal because a lot of icons are missing compared to Segoe MDL2 but it is much better than the winjs font (the list of the icons are in this .xlsx file).

robloo commented 4 years ago

Any updates on this? Honestly, Line Awesome fonts (optionally MIT licensed) seems the way to go at this point. Looking through the icons they are almost perfect. Now that this issue is assigned to @davidjohnoliver, and he's working on https://github.com/unoplatform/uno/pull/3663, I'm assuming the Uno team made the same call? At the moment I can't think of any other fundamental blockers (excluding missing controls) stopping most apps from using Uno without significant changes.

kakone commented 4 years ago

I hoped a change about MDL2 licensing (see this thread) but there is nothing for the moment. There is also a good new fluent icon collection but a lot of icons is missing compared to MDL2. There is no ideal solution at the moment.

davidjohnoliver commented 4 years ago

@robloo @kakone At the moment we're looking at Microsoft's recently-released Fluent System Icons which are MIT-licensed as a base set. As @kakone notes they're not a 1:1 match for Segoe MDL2, but they're created for the Fluent design language, which is nice.

robloo commented 4 years ago

@davidjohnoliver Nice! I wasn't aware of the fluent system icons. Is there a framework in place for putting all of this together? I'm thinking we need to:

  1. Identify the glyphs used in control templates (checkbox, etc.) Then, using the fluent system icons as base, modify them to be pixel-perfect equivalent of the MDL2 font. We don't want to be changing margins/padding in control templates to customize them for Uno. This will make future updates to styles very quick and avoid regressions.
  2. Import all Fluent System Icons and align them as best as possible with the Segoe MDL2 glyph positions. This does not have to be pixel perfect like #1 though so can be done much more quickly.
  3. Import Line Awesome fonts to fill more of the gaps not covered by #2. Again, align glyph positions as best as possible but it doesn't have to be perfect.
  4. Allow for designers and developers to re-create missing glyphs as needed (svg files) and have them built within the new font.

All together it seems like we will need a new toolset to automatically build an equivalent MDL2 font based on configuration files and input glyphs from multiple sources.

robloo commented 4 years ago

Is this considered closed now?

davidjohnoliver commented 4 years ago

Is this considered closed now?

I don't think so, v1 of the font is available for use, but we still want to release the automated tooling to generate the font. cc @alextrepa

MartinZikmund commented 4 months ago

All sources for our fonts are at https://github.com/unoplatform/uno.fonts , including source SVGs