Page 1 of 1

Updated Icons and new SVG Paths Library

Posted: Tue Mar 14, 2023 10:44 pm
by OpenXTalkPaul
So getting into Apple's NSImages and Core Image stuff and their 'systemSymbols' (the SF icons commonly found in macOS and iOS apps), I wanted to add some more cross platform stuff that's open source and not tied to Apple (some of their glyphs have a use-restrictions problem for example).

Yeah the IDE already includes some (300 or so) of the Free version of FontAwesome, but that was based on FA v.3 or 4 and hasn't been updated in many years. The obvious choice was Material Icons, the free open source Google symbol icon 'font'. So I created a tab separated values (tsv) file containing all 6063 icons from Material v.4.0, and wrote a script to turn that into an Extension library similar to IconSVG. However I hit a wall where the Extension Builder has a 10,000 line limit, so I made it a regular script library that does exactly the same thing (and works very well).

However I wasn't satisfied, so I took that work much further. I figured out how to 'slurp' the .TSV file with Extension Builder and then parse it into the required 'font' array format used by IconSVG. So then I has a method for reading in these spread-sheet=like tabbed data 'fonts' and loading them for IconSVG lib to use, I figured I might as well add some more free sets right? I made another script for extracting the glyph names and corresponding SVG Path data from *'webfont.svg' and then formatting that into this tabbed data, making an 'import font' method. I tried some other TTF/ OTF fonts converted into SVG font using FontForge and had no problem reading them in (OK there's a half a second or so delay when loading >6,000 names/paths).

With this new SVG Icon Library I'll be including ALL 6,063 of the current Material Icons, and of course the OXT exclusive 'oxtide' font (mostly based on HyperCard icons), as well as some others, AND most importantly the ability for anyone to fairly easily add their own sets.

Now, I actually have a LOT more ideas about a library capable of SVG paths manipulation that may be added. For example walking through the sub path elements (move to, one to, curve to) of a path's string, animating that, or getting a stretched of perspective distorted version or the icons path (with the transforms applied), but the main goal of opening up the IDE to a LOT more icons happened rather quickly.

I'm already finding The demo stack I made very useful (even just for using the existing IconSVG). It allows you to pick an Icon set, search for icons by name or arrow-key scroll through list, and drag and drop to another stack to create instances of the SVIcon widget.

I just need to make sure that proper attribution is given for whatever Icon sets I wind up including.