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

Segoe Fluent Icon unable to render when using binding on Windows 10 #10150

Open
HO-COOH opened this issue Nov 11, 2024 · 0 comments
Open

Segoe Fluent Icon unable to render when using binding on Windows 10 #10150

HO-COOH opened this issue Nov 11, 2024 · 0 comments
Labels
bug Something isn't working needs-triage Issue needs to be triaged by the area owners

Comments

@HO-COOH
Copy link

HO-COOH commented Nov 11, 2024

Describe the bug

So on Windows 10, we cannot package Segoe Fluent Icon font directly in the package. So I wrote a font downloader which download and extract the font to application local folder. Then I update the FontFamily. But it seems that using {x:Bind} to bind to FontFamily will have issues rendering on windows 10. It renders as a block character. Directly setting FontFamily in xaml have no such issues.

Steps to reproduce the bug

  1. Create a new WinUI3 Packaged project
  2. Use this xaml
        <TextBlock Text="Set FontFamily to Segoe Fluent Icon in XAML" />
        <FontIcon FontFamily="ms-appdata:///local/Segoe%20Fluent%20Icons.ttf#Segoe Fluent Icons" Glyph="&#xE701;" />

        <TextBlock Text="Set FontFamily to Segoe MDL2 in XAML" />
        <FontIcon FontFamily="ms-appdata:///local/segmdl2.ttf#Segoe MDL2 Assets" Glyph="&#xE701;" />

        <TextBlock Text="Set FontFamily to Segoe Fluent Icon in binding" />
        <FontIcon FontFamily="{x:Bind FluentIconFont}" Glyph="&#xE701;" />

        <TextBlock Text="Set FontFamily to Segoe MDL2 in binding" />
        <FontIcon FontFamily="{x:Bind MDLIconFont}" Glyph="&#xE701;" />

Code behind

    winrt::Microsoft::UI::Xaml::Media::FontFamily GlyphsPage::FluentIconFont()
    {
        return winrt::Microsoft::UI::Xaml::Media::FontFamily{
            std::format(L"{}\\Segoe Fluent Icons.ttf#Segoe Fluent Icons", winrt::Windows::Storage::ApplicationData::Current().LocalFolder().Path())
        };
    }
    winrt::Microsoft::UI::Xaml::Media::FontFamily GlyphsPage::MDLIconFont()
    {
        return winrt::Microsoft::UI::Xaml::Media::FontFamily{
            std::format(L"{}\\segmdl2.ttf#Segoe MDL2 Assets", winrt::Windows::Storage::ApplicationData::Current().LocalFolder().Path())
        };
    }
  1. Download and extract Segoe Fluent Icons.ttf to AppData\Local\Packages\{...id...}\LocalState
  2. Build and run

Expected behavior

No response

Screenshots

Image

NuGet package version

WinUI 3 - Windows App SDK 1.6.1: 1.6.240923002

Windows version

Windows 10 (1809): Build 17763

Additional context

No response

@HO-COOH HO-COOH added the bug Something isn't working label Nov 11, 2024
@microsoft-github-policy-service microsoft-github-policy-service bot added the needs-triage Issue needs to be triaged by the area owners label Nov 11, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working needs-triage Issue needs to be triaged by the area owners
Projects
None yet
Development

No branches or pull requests

1 participant