CODEWITHSUNDEEP
fontsmaui
Livio
Livio

Reputation: 75

Font doesn't display correctly in .Net MAUI

I'm experiencing problems using a font in MAUI. The project in which the font is used is very very simple (the general Hello World!). The font is placed in the correct directory (Resources/Font), is placed in the MauiProgram.cs but the font doesn't display. Does anybody know why?

namespace MauiTest;

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                fonts.AddFont("Creamer.ttf", "MyFont");
            });

        return builder.Build();
    }
}

Font in the right position

I'm using Visual Studio 2022 version 17.4.3. Many thanks!

Upvotes: 2

Views: 4200

Answers (5)

Abdulrhman Alrifai
Abdulrhman Alrifai

Reputation: 45

It is not applicable to your case, but someone might find this helpful. The default MAUI app template include font files with spaces in the file name (for example "OpenSans Regular.ttf") substituting the spaces with "-" in the file name and its reference in MauiProgram.cs will solve the problem.

Upvotes: 0

Michael
Michael

Reputation: 1

I had some similar experience: Sometimes everything worked fine, sometimes it doesn't. After trying the above solution, it worked just like a direction signal on my car: working, not working, working.

Then I just opened the project file and changed Update into Include:

<ItemGroup>
    <MauiFont Include="Resources\Fonts\digital7.ttf">
    </MauiFont>
    <MauiFont Include="Resources\Fonts\MaterialDesignIcons.ttf">
    </MauiFont>
</ItemGroup>

Now, everything works like expected.

Upvotes: 0

Cristina Monea
Cristina Monea

Reputation: 31

I was facing the same problem. For me, it worked by changing the Build Action property to MauiFont and Copy to Output Directory to Copy Always.

Upvotes: 2

Aaron
Aaron

Reputation: 77

I didnt try the 1st answer in Behnam's response but I did try the second which didnt work and gave me the same @(Content) build action is not supported.

So after a quick google of Maui fonts to find a new font, I instead

  1. right clicked on my .ttf file,
  2. went to properties,
  3. changed build action to Maui Font,
  4. then rebuild the app.

I compared the changes before and after and my font did go back to how I wanted it. Hopefully this answer helps someone else.

Upvotes: 4

Behnam
Behnam

Reputation: 66

It is possible that there is a compatibility issue with the font you are trying to use. Can you try using a different font to see if it works? If that doesn't solve the issue, you could try adding the font to the system and then referencing it in your code.

Another possibility could be that the font file is not being included in the build output. You can check this by right-clicking the font file in Visual Studio and selecting "Properties." Ensure that the "Build Action" property is set to "Content" and the "Copy to Output Directory" property is set to "Copy if newer."

Upvotes: 3

Related Questions