Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for Duotone in Pro fonts #223

Open
MatrixSenpai opened this issue Aug 12, 2019 · 16 comments
Open

Support for Duotone in Pro fonts #223

MatrixSenpai opened this issue Aug 12, 2019 · 16 comments

Comments

@MatrixSenpai
Copy link
Collaborator

Font Awesome 5.10 adds a new font type: Duotone. Be awesome to have that available!

@stale
Copy link

stale bot commented Sep 11, 2019

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the stale label Sep 11, 2019
@MatrixSenpai
Copy link
Collaborator Author

@thii any ideas? I added it to one of my projects, but couldn't see the light (i think?) part of the font when displayed. i think it might have to be only used with an UIImage, not sure though

@stale stale bot removed the stale label Sep 11, 2019
@MatrixSenpai
Copy link
Collaborator Author

Just as an update, I've started investigating using the duotone fonts. Note that when using codegen.swift an error will be thrown when decoding the oven (pro-only) icon, because the path property can be a single string or an array of strings. This can be worked around by removing path from the Codable enum.

On that same note, is it possible to simply have the library draw the SVGs themselves?

This may also relate to #230 when it comes to pro-only fonts

@MatrixSenpai
Copy link
Collaborator Author

This library supports drawing SVGs in a UIView or CALayer, although this would need some further finagling. Another enum for SVGs could be generated using the raw or path properties provided by the metadata...

@thii thoughts?

@MoElnaggar14
Copy link
Contributor

it's merged #247

@MatrixSenpai
Copy link
Collaborator Author

To clarify: This does not actually add support for rendering duotone fonts. It only fixes an issue when it comes to parsing the metadata. Therefore, it's not actually relevant to this issue, but is relevant to #230

@MoElnaggar14
Copy link
Contributor

I will upload a new PR that I fixed this issue

@MatrixSenpai
Copy link
Collaborator Author

It would seem that SVGs are included in both Free and Pro metadata files, which is good news. This may take some further investigation, especially when it comes to rendering UIImages and UIBarButtonItems (with images). UILabels will not be able to render them at all, most likely. This is something I may try to put some time into myself. It's not going to be as simple as it seems.

In the short term, it's possible to make the SVG paths available as a property of the enum. Since only duotone icons have an array for the SVG path, it can simply be a property like svgPath: String added to the FontAwesome enum

@MoElnaggar14
Copy link
Contributor

@MatrixSenpai check this #250

@ghowen
Copy link

ghowen commented Mar 27, 2020

@MoElnaggar14: As @MatrixSenpai said: Your patch might fix the issue with parsing the metadata. But it does not help to render the duotone icons correctly!

I agree with @MatrixSenpai that this can only be done for images, as with fonts you can have a different color per letter but not a letter with two colors.

To make the SVG part of the enum sounds sensible to me. It will increase the size of the library (and app size) quite a bit though. But this is probably the price we'll have to pay.

It looks like at the moment only one path is rendered from the font when selecting the duotone style. If we can managed to render the second part somehow separately, we could then overlay the two renderings. But I have no clue if this is at all possible.

@MoElnaggar14
Copy link
Contributor

@ghowen I think it's not possible for SVG part

@MatrixSenpai
Copy link
Collaborator Author

My thoughts are to add a new generated plist that has the SVG paths in it. We can load and unload that data from memory at will. There's a price to pay in terms of performance, but we reduce our footprint in memory. If I recall correctly, an enum is loaded in at runtime to memory, but if we're using these only in places that support images (i.e. UIImage, UIBarButton, UIButton) then that shouldn't cause a problem

As for the PR, I've left my comments on that, but I will say here that it doesn't solve the issue, it only adds capability. I tried that method unsuccessfully. It's going to have to be rendered as an SVG because iOS doesn't have the ability to, as @ghowen said, use separate colors for a single char

@chriszielinski
Copy link

No need for SVGs, fortunately. Duotone is accessible to us from the ligature-based font file. Here's a lil taste.

nice

That being said, UIKit Duotone functionality depends on some things introduced in #245. Which, in turn, leads to some modifications... & some digging & I've decided to rewrite the entire thing. Given that & the fragmentation in #245, I'm thinking it may be time for a new repo... Thoughts?

@MatrixSenpai
Copy link
Collaborator Author

I haven't worked with ligatures before, great find! I definitely like the way that's moving. I agree, we may have to move this to a new project entirely though

@ghowen
Copy link

ghowen commented Mar 31, 2020

Wow, if we can do this with ligatures instead of SVG, this would be great. Re. new repo: Ideally we could do an in place update, so people would not need to touch their apps. Are breaking changes necessary?

@ghowen
Copy link

ghowen commented Mar 31, 2020

I downloaded #245 and tried to test it with duotone icons, but the demo app for iOS crashes in FontAwesome.swift:331 with the following error:

Optional(Swift.Unmanaged<__C.CFErrorRef>(_value: Error Domain=com.apple.CoreText.CTFontManagerErrorDomain Code=105 \"Could not register the font file(s)\" UserInfo={NSDescription=Could not register the font file(s), CTFontManagerErrorFontURLs=(\n \"file:///Users/georg/Library/Developer/Xcode/DerivedData/FontAwesomeDemo-fwlkvbctoqyabcfinpnjintpexxu/Build/Products/Debug-iphonesimulator/FontAwesome.framework/Font%20Awesome%205%20Duotone-Solid-900.otf\"\n)}))

It does work with all other pro styles and icons though. I am using the fonts from the "Pro Desktop Download" of FA Pro 5.13, as they supposedly have the ligatures.

BTW: Currently the folks from FA do not recommend to use font files for duotone:

Using Ligatures with Duotone Icons isn't Currently Recommended
While we've included a duotone ligature-based font file in our Pro desktop download, we can't recommend it as a way to use our icons on the desktop.
https://fontawesome.com/how-to-use/on-the-desktop/referencing-icons/duotone-icons

@chriszielinski How did you get the screenshot in #223 (comment) rendered?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants