CODEWITHSUNDEEP
androidiosxamarinxamarin.formsfont-awesome
aqwright31
aqwright31

Reputation: 169

Why doesn't Font Awesome display for iOS apps using Xamarin Forms?

I'm trying to add font awesome icons to my tabbed page tabs. I've followed what I believe are the correct steps to be able to configure display font awesome icons for Xamarin.forms applications but for some reason the icons display for the android app but not the iOS app.

enter image description here enter image description here

I first added the font awesome .ttf files to the android Assets folder and the iOS Resources folder:

Android iOS

Next I updated the Info.plist file for iOS in order to include the .ttf files from Font Awesome:

enter image description here

Then I configured use of the Font Awesome icons in App.xaml:

enter image description here

Finally I added the needed icons to the their tabs:

enter image description here

Upvotes: 2

Views: 2721

Answers (4)

Savage
Savage

Reputation: 2349

Another approach is to add the fonts as an Embedded Resource in the main project (the abstracted one, not *.iOS) and add the following to the top of App.xaml.cs (above the namespace):

[assembly: ExportFont("fa-solid-900.ttf", Alias = "FASolid")]
[assembly: ExportFont("fa-regular-400.ttf", Alias = "FARegular")]
[assembly: ExportFont("fa-brands-400.ttf", Alias = "FABrands")]

This approach works for both Android and iOS.

Upvotes: 1

Hassan Rahman
Hassan Rahman

Reputation: 5203

Setting these values works for both Android and iOS in App.xaml.

        <OnPlatform x:Key="FontAwesomeBrands"
                    x:TypeArguments="x:String">
            <On Platform="iOS"
                Value="FontAwesome5Brands-Regular" />
            <On Platform="Android"
                Value="FontAwesome5BrandsRegular400.otf#" />
        </OnPlatform>

        <OnPlatform x:Key="FontAwesomeSolid"
                    x:TypeArguments="x:String">
            <On Platform="iOS"
                Value="FontAwesome5Free-Solid" />
            <On Platform="Android"
                Value="FontAwesome5FreeSolid900.otf#" />
        </OnPlatform>

        <OnPlatform x:Key="FontAwesomeRegular"
                    x:TypeArguments="x:String">
            <On Platform="iOS"
                Value="FontAwesome5Free-Regular" />
            <On Platform="Android"
                Value="FontAwesome5FreeRegular400.otf#" />
        </OnPlatform>

Upvotes: 1

nevermore
nevermore

Reputation: 15786

On iOS, please use 'Real' name of font instead of the filename.

You can check this by rightclick on font file -> Properties -> Details -> Title on the windows. For example, I test a custom font file which the file name is Font Awesome 5 Free-Solid-900.otf. It does not work if set the value to the file name:

<OnPlatform x:TypeArguments="x:String" x:Key="FontAwesomeSolid">
    ...
    <On Platform="iOS" Value="Font Awesome 5 Free-Solid-900" />
</OnPlatform>

Try getting the tilte of the custom font file and remove the 'space'.

enter image description here

Specify the value like below:

<OnPlatform x:TypeArguments="x:String" x:Key="FontAwesomeSolid">
    <On Platform="iOS" Value="FontAwesome5Free-Solid" />
</OnPlatform>

Refer: Font Awesome not working in iOS

Upvotes: 4

Muhammad Adeel Shoukat
Muhammad Adeel Shoukat

Reputation: 345

Replace your iOS values in App.xaml.

<OnPlatform x:TypeArguments="x:String" 
                x:Key="FontAwesomeBrands">
                <On Platform="iOS"
                Value="FontAwesome5Brands-Regular" />
            </OnPlatform>

            <OnPlatform x:TypeArguments="x:String" 
                x:Key="FontAwesomeSolid">
                <On Platform="iOS" 
                Value="FontAwesome5Free-Solid" />
            </OnPlatform>

            <OnPlatform x:TypeArguments="x:String" 
                x:Key="FontAwesomeRegular">
                <On Platform="iOS" 
                Value="FontAwesome5Free-Regular" />
            </OnPlatform>

To get the correct font Name to use in iOS use below code in AppDelegate in FinishedLaunching.

foreach (var family in UIFont.FamilyNames)
            {
                System.Diagnostics.Debug.WriteLine($"{family}");
                foreach (var names in UIFont.FontNamesForFamilyName(family))
                {
                    System.Diagnostics.Debug.WriteLine($"{names}");
                }
            }

Upvotes: 0

Related Questions