Custom Font not working

jrahma 111 Reputation points
2021-03-04T21:05:06.6+00:00

Hi,

i am trying to use Font Awsome as the custom font in my app.

I added the icon and set it to EmbeddedResources and added:

[assembly: ExportFont("FontAwesomeRegular.otf", Alias = "FontRegular")]

but I am not getting the icon shown and it just shows the default question mark instead..

<Image>
<Image.Source>
    <FontImageSource Grid.Column="4" FontFamily="FontRegular" Color="Black" Glyph="&#xf004;"/>
</Image.Source>
</Image>

Kindly help..

Thanks,
Jassim

Xamarin
Xamarin
A Microsoft open-source app platform for building Android and iOS apps with .NET and C#.
5,290 questions
0 comments No comments
{count} votes

7 answers

Sort by: Most helpful
  1. Cole Xia (Shanghai Wicresoft Co,.Ltd.) 6,751 Reputation points
    2021-03-05T03:16:09.767+00:00

    I test on my side , the icon shows as expected .

    74589-2.png

    Check the following steps :

    • Go to Font Awesome website and download the font file .

    74500-cap77777ture.png

    • Copy the file into shared project , notice : I select Solid not Regular .

    74506-capture.png

    74576-3.png

    • Set its build Action to Embedded resource .

    74559-4.png

    • Add the following code into AssemblyInfo.cs

    [assembly: ExportFont("Font Awesome 5 Free-Solid-900.otf", Alias = "customFont")]

    • Usage in Page. <Image>
      <Image.Source>
      <FontImageSource Grid.Column="4" FontFamily="customFont" Color="Black" Glyph=""/>
      </Image.Source>
      </Image>

  2. StephenH 86 Reputation points
    2021-03-05T15:46:38.6+00:00

    I am having this issue as well

    I have imported the font like so
    [assembly: ExportFont("FontAwesome5Pro_Light_300.otf", Alias = "FA5Light300")]

    I have a font and it's set to "Embedded Resource"
    74888-image.png

    In my XAML for the AppShell.xaml I have this ...
    74836-image.png

    This uses a namespace to point to the string value for "Sync" contained in FA5ProLight300.cs
    xmlns:fontAwesome="clr-namespace:XXXamarin.Fonts;assembly=XXXamarin"
    fontAwesome:FA5ProLight300.Sync

    I have even tried the escaped value and that doesn't work ether ....

    0 comments No comments

  3. StephenH 86 Reputation points
    2021-03-05T15:48:27.927+00:00

    I generated a class with constants using this ...
    https://andreinitescu.github.io/IconFont2Code/

    Also just noticed .. I am running Visual Studio 2019 on WIndows with MFractor and it decodes things properly while running and I put my pointer over it in the XAML ...

    74903-image.png

    0 comments No comments

  4. StephenH 86 Reputation points
    2021-03-07T00:21:13.197+00:00

    So the awesome guys at Mfractor suggested I try the ttf instead of the otf and that did not make a difference

    This works ...
    75048-image.png

    But this does not
    75086-image.png

    And again .. Mfractor knows what it is ....
    75087-image.png

    I even tried a different string constants file to no avail ...

    0 comments No comments

  5. StephenH 86 Reputation points
    2021-03-07T00:40:54.857+00:00

    I have uploaded a simple app using the ttf file and a known good working string constants file from here
    https://github.com/matthewrdev/fa2cs/blob/master/FontAwesomeIcons.cs

    https://github.com/stephenhauck/FontAwesomeCustomFont