search

jsmarcus / Iconize

Use icon fonts in your Xamarin.Forms application!
Other
204 stars 71 forks source link

FontAwesome in sample app on iOS not working #83

Open john-dalsgaard opened 6 years ago

john-dalsgaard commented 6 years ago

And the same goes for the icons in the title bar to the right (they show as a small rectangle with a question mark inside).

pakbaz commented 6 years ago

I figured it out. For iOS, for font awesome, You have to add fonts manually to resourced folder. then add the reference for those in info.plist . This is actually better since you can add the version of the font you want instead of Iconize adding it for you. As for the sample project, I think They forgot to update that portion of it

john-dalsgaard commented 6 years ago

Thanks - I'll try that out!

john-dalsgaard commented 6 years ago

@pakbaz Have you tried to use the tabbar at the bottom in Android (new in Forms 3.1)?

It does funny things with the icons in my app when I try that (colours etc.)

john-dalsgaard commented 6 years ago

@pakbaz So in the test app I added these font files (with BuildAction -> BundleResource):

But they still don't show up.

The references in info.plist are already there as per the instructions.

What did you do differently?

ClausElmann commented 5 years ago

@john-dalsgaard

On IOS, try using .otf files from https://github.com/FortAwesome/Font-Awesome/tree/master/use-on-desktop

jsmarcus commented 5 years ago

The .ttf files are the correct files but Iconize is expecting them to be named the following:

iconize-fontawesome-brands.ttf iconize-fontawesome-regular.ttf iconize-fontawesome-solid.ttf

From: ClausElmann notifications@github.com Sent: Wednesday, September 19, 2018 3:28 PM To: jsmarcus/Iconize Iconize@noreply.github.com Cc: Subscribed subscribed@noreply.github.com Subject: Re: [jsmarcus/Iconize] FontAwesome in sample app on iOS not working (#83)

@john-dalsgaardhttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fjohn-dalsgaard&data=02%7C01%7C%7C00235610e9d643096fc408d61e6606d0%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636729820872965606&sdata=bPG2fadhEFsIxjf3E3%2BcpScpZy8benJKH2YQSC26kUU%3D&reserved=0

On IOS, try using .otf files from https://github.com/FortAwesome/Font-Awesome/tree/master/use-on-desktophttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2FFortAwesome%2FFont-Awesome%2Ftree%2Fmaster%2Fuse-on-desktop&data=02%7C01%7C%7C00235610e9d643096fc408d61e6606d0%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636729820872965606&sdata=ZJI7ziBrEsw8t75AEOHZnirixtJjgIR8cqDk%2B3oz%2FgA%3D&reserved=0

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHubhttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fjsmarcus%2FIconize%2Fissues%2F83%23issuecomment-422928993&data=02%7C01%7C%7C00235610e9d643096fc408d61e6606d0%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636729820872965606&sdata=8btjbcPvX4k5l%2BedgNTgaKSzPPjO8f9GYLEU5mjiBV4%3D&reserved=0, or mute the threadhttps://eur03.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fnotifications%2Funsubscribe-auth%2FAB1LIDXpQcdbI4_T68xs-wwqPfgViKeFks5ucprCgaJpZM4WwWrj&data=02%7C01%7C%7C00235610e9d643096fc408d61e6606d0%7C84df9e7fe9f640afb435aaaaaaaaaaaa%7C1%7C0%7C636729820872965606&sdata=jyNQVbCfJk8XhQU9bI%2BFRu5BOUV8YqS8ZWGJiRvrc%2B8%3D&reserved=0.

ClausElmann commented 5 years ago

@jsmarcus

Strange - my app on IOS did not work with .ttf (renamed as stated above), only when I found the .otf version it was fixed :-) Android seems to work with both types

john-dalsgaard commented 5 years ago

It worked - but I had to use the .otf files as well as rename them as @jsmarcus mentioned.

After each change of files I cleaned the project and then ran it in debug mode on the simulator. Not sure if I should have done that differently?

AbeHamade commented 5 years ago

Does anyone happen to have an actual working sample for iOS? I think I tried every combination posted here and nothing works. I would love to see a working version if someone would not mind posting it.

AbeHamade commented 5 years ago

This is what I assumed to work:

In the info.plist file add:

<array> <string>iconize-entypoplus.ttf</string> <string>iconize-fontawesome-regular.otf</string> <string>iconize-fontawesome-solid.otf</string> <string>iconize-fontawesome-brands.otf</string> <string>iconize-ionicons.ttf</string> <string>iconize-material.ttf</string> <string>iconize-meteocons.ttf</string> <string>iconize-simplelineicons.ttf</string> <string>iconize-typicons.ttf</string> <string>iconize-weathericons.ttf</string> </array>

Use the otf files downloaded from: HERE

Rename them accordingly:

iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

also tried....

iconize-fontawesome-brands.ttf iconize-fontawesome-regular.ttf iconize-fontawesome-solid.ttf

Place them in iOS Application Resources directory set to BundledResource.

Test Form uses:

<iconize:IconLabel FontSize="Large" VerticalOptions="Center" Text="fab-apple"/>

Clean All, Build, Deploy.

Result is no icon show, just the raw text.

matteopiccioni commented 5 years ago

Same problem here Thanks!

cklenk commented 5 years ago

I was finally able to get this to work on iOS by downloading the Fontawesome otf files. Renaming them to iconize-fontawesome-regular/solid/brands.otf and adding them as a bundle resource in the project. Is this by design? Will this be a manual update whenever Fontawesome releases an update?

sidatacom commented 5 years ago

Not working for me with IconImage in iOS on Android works fine but not in iOS. Can someone fix this ?

Pirate911 commented 5 years ago

It's not working for me either in ios . I updated to latest lib .

Suplanus commented 5 years ago

You have to add the ttf files manually in the iOS project in Resources (BundleResource). You also have to change the info.plist to the following:

<key>UIAppFonts</key>
<array>
    <string>iconize-fontawesome-brands.ttf</string>
    <string>iconize-fontawesome-regular.ttf</string>
    <string>iconize-fontawesome-solid.ttf</string>
</array>
sidatacom commented 5 years ago

.ttf ?? i added the .otf files ??? Why .ttf ?

Suplanus commented 5 years ago

I think it can also work with otf files. But ttf is the default.

wickedw commented 5 years ago

Hi All,

I have hit the same issues as this thread, but its long and picking the solution was confusing, here is what worked for me on VS for MAC, thanks to all above who helped.

  1. Download .OTF files from https://github.com/FortAwesome/Font-Awesome/tree/master/use-on-desktop

  2. Rename them to TTF (yes change the extension!) as follows -

iconize-fontawesome-brands.ttf iconize-fontawesome-regular.ttf iconize-fontawesome-solid.ttf

I assume we could just get them from here too - https://github.com/jsmarcus/Iconize/tree/master/src/Fonts/Plugin.Iconize.FontAwesome

  1. Add them to Resources folder and BundleResource build action.

  2. Update plist - 

<key>UIAppFonts</key>
<array>
    <string>iconize-fontawesome-brands.ttf</string>
    <string>iconize-fontawesome-regular.ttf</string>
    <string>iconize-fontawesome-solid.ttf</string>
</array>
  1. Go!

And thanks for a great library.

ianvink commented 5 years ago

Try this:
https://ianvink.wordpress.com/2019/01/24/fontawsome-pro-in-xamarin-forms-apps/

john-dalsgaard commented 5 years ago

Thanks for an interesting article @ianvink.

However, and this may be due to my lack of knowledge, I would have liked to see an example of how you used the icons in your forms code using the helper class that you created. Specifically, I was looking for how to specify the icon name in the helper class?

Tuytje commented 5 years ago

Was anyone able to get this working? I'm struggling with the same issues and it seems that it is only font awesome that is not working.

awatertrevi commented 5 years ago

Did anyone get this to work? I tried all of the above. It would be really nice if someone who got it to work could update the sample.

Wallysantos commented 5 years ago

hi @awatertrevi

I did this: https://github.com/jsmarcus/Iconize/issues/124#issuecomment-461461135

I hope it helps you. It worked perfectly in my project.

awatertrevi commented 5 years ago

Hi @Wallysantos,

I replicated the steps you mentioned, but unfortunately everything still appears as a question mark.

awatertrevi commented 5 years ago

It also seems that the Jam Icons is broken too.

flamecrow commented 5 years ago

So it was working on iPhone XS Max simulator but not iPhone 6s.

I followed instructions and downloaded the tff files here: https://github.com/jsmarcus/Iconize/tree/master/src/Fonts

Then included it in the Resources folder in Xamarin.iOS and it is working now.

DuncanMcIntyre commented 5 years ago

I had the same issue using ttf files and references, but it is now working for me after adding the otf files in iOS' Resources folder and changing the references in Info.plist to .otf as well.

Files in Resources folder: iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

References in Info.plist:

UIAppFonts iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf
snickler commented 5 years ago

One thing to remember when dealing with iOS, PLEASE make sure you get the latest versions of the fonts from Font Awesome's site. I've been bashing my head over and over and over after updating to the latest version of the plugin, and realized that I was still using Font Awesome v4 fonts. As soon as I downloaded the latest, renamed them as every comment explained (including the extension change to ttf), and added them in Info.plist, it all worked.

Another tip: If you rename the extension from .otf to .ttf from WITHIN Visual Studio, it automatically changes the Build Action to None. Be sure to go through and change each one back to BundleResource

Suplanus commented 5 years ago

In 3.4 it works. If i update to 3.5 nothing is showing

snickler commented 5 years ago

@Suplanus - Make sure your actual font files are updated from the Font Awesome repo. I just tried this on 3.5 last night and finally got it working (on iOS at least)

Suplanus commented 5 years ago

That was the problem, thanks @snickler. I was confused because i made a rollback via git and the problem was still there. The preview was OK.

Think there is a crazy cache of the fonts, which make the problems (like in this issue).

snickler commented 5 years ago

Yeah @Suplanus , I think there is definitely a cache that happens when BundleResources are in the mix for some reason. I went through the same thing before yelling at my laptop :D

Pirate911 commented 5 years ago

Till now this awesome lib isn't working as expected ...Any solution to this issue @jsmarcus :( ?

andrewsheley commented 5 years ago

Can someone explain how the f*** you get these stupid fonts to work in IOS? I have followed all these "instructions" and nothing works. Surely their is a clear concise set of instructions to explain how this works because nothing I've done is working.

Pirate911 commented 5 years ago

Can someone explain how the f*** you get these stupid fonts to work in IOS? I have followed all these "instructions" and nothing works. Surely their is a clear concise set of instructions to explain how this works because nothing I've done is working.

That's what everyone is complaining about :(

flamecrow commented 5 years ago

Can someone explain how the f*** you get these stupid fonts to work in IOS? I have followed all these "instructions" and nothing works. Surely their is a clear concise set of instructions to explain how this works because nothing I've done is working.

Just forget it, as of today I can't get it to work either.

DuncanMcIntyre commented 5 years ago

Can someone explain how the f*** you get these stupid fonts to work in IOS? I have followed all these "instructions" and nothing works. Surely their is a clear concise set of instructions to explain how this works because nothing I've done is working.

I got it working after adding the otf files in iOS' Resources folder and changing the references in Info.plist to .otf as well.

Files in Resources folder: iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

References in Info.plist: UIAppFonts

iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

Pirate911 commented 5 years ago

Can someone explain how the f*** you get these stupid fonts to work in IOS? I have followed all these "instructions" and nothing works. Surely their is a clear concise set of instructions to explain how this works because nothing I've done is working.

I got it working after adding the otf files in iOS' Resources folder and changing the references in Info.plist to .otf as well.

Files in Resources folder: iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

References in Info.plist: UIAppFonts

iconize-fontawesome-brands.otf iconize-fontawesome-regular.otf iconize-fontawesome-solid.otf

Can you post a working sample proj plz?

matteopiccioni commented 5 years ago

you should use FontImageSource introduced in x.f. 4.0 (or 3.6 I dont remember) It works very well

Pirate911 commented 5 years ago

you should use FontImageSource introduced in x.f. 4.0 (or 3.6 I dont remember) It works very well

Does it work for toolbar item as well ?

matteopiccioni commented 5 years ago

I dont think, you could try to use TitleView or to make a 'fake' navigation bar (as I did) in this way (https://www.thewissen.io/create-a-kickass-banking-app-using-a-basepage-in-xamarin/)

Pirate911 commented 5 years ago

Thank you @matteopiccioni ..That sounds like a better idea. 👍

andrewsheley commented 5 years ago

I got font awesome to work with Android and IOS. The problem I had was if I changed the font it wouldn't show up in the emulator. So I delete the app from the emulator, clean the IOS project then debug again and it works. I created a video following the article of James Montamagno.

https://youtu.be/p92T9djL2-U