简体   繁体   中英

Custom Font working in Uno.WASM, but not working in Uno.UWP

Since i have not seen something helpful after searching for a while, i decided to ask here:

I have a small testing Project, just to import a custom Icon Font from the interwebs. Current Proedure is the following: my MainApp.xaml consists of a single Textblock, which is referencing a Style-element in Styles.xaml, which in turn references a FontFamily where i load the ttf file per platform.

In WASM it works great (base64 URI), but in UWP i just cant get the font-icon to display at all. The Style.xaml gets imported perfectly by the App.xaml, the Size gets applied, but it seems there is something wrong with the FontFamily-Tags.

I tried:

  1. Installing my font by hand => Worked like a charm. So its probably not the font file?
  2. https://platform.uno/docs/articles/features/custom-fonts.html , but it didn't help.
  3. https://blog.mzikmund.com/2020/01/custom-fonts-in-uno-platform/ which in turn, didn't change much.
  4. https://github.com/MartinZikmund/blog-2020/tree/master/Uno.CustomFonts even after cross-referencing here, i couldn't get it to work.
  5. https://github.com/unoplatform/calculator/blob/uno/src/Calculator.Shared/Styles.xaml i also cross-checked with the official calculator-port, but even after setting things up like they did, nothing changed.
  6. Reinstall VS (i use the Community Version). Here's my Code:

MainApp.xaml:

<Page
    x:Class="Testing.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Testing"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock Text="L"  Style="{ThemeResource IconTextStyle}" />
    </Grid>
</Page>

Styles.xaml:

<ResourceDictionary
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
            xmlns:xamarin="http://uno.ui/xamarin"
            xmlns:macos="http://uno.ui/macos"
            xmlns:wasm="http://uno.ui/wasm"
            xmlns:skia="http://uno.ui/skia"
            xmlns:win="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            mc:Ignorable="xamarin wasm macos skia"
    >


    <win:FontFamily x:Key="IconScratchedFontFamily">ms-appx:///Assets/PWSmallIcons.ttf#Small-Icons-Scratched</win:FontFamily>
    <macos:FontFamily x:Key="IconScratchedFontFamily">ms-appx:///Assets/PWSmallIcons.ttf#Small-Icons-Scratched</macos:FontFamily>
    <wasm:FontFamily x:Key="IconScratchedFontFamily">Small-Icons-Scratched</wasm:FontFamily>
    <skia:FontFamily x:Key="IconScratchedFontFamily">ms-appx:///Assets/PWSmallIcons.ttf#Small-Icons-Scratched</skia:FontFamily>

    <win:FontFamily x:Key="IconClearFontFamily">ms-appx:///Assets/PWSmallIconsFree.ttf#Small-Icons-Free</win:FontFamily>
    <macos:FontFamily x:Key="IconClearFontFamily">ms-appx:///Assets/PWSmallIconsFree.ttf#Small-Icons-Free</macos:FontFamily>
    <wasm:FontFamily x:Key="IconClearFontFamily">Small-Icons-Free</wasm:FontFamily>
    <skia:FontFamily x:Key="IconClearFontFamily">ms-appx:///Assets/PWSmallIconsFree.ttf#Small-Icons-Free</skia:FontFamily>

    <Style TargetType="TextBlock" x:Key="IconTextStyle">
        <Setter Property="FontFamily"
            Value="{StaticResource IconScratchedFontFamily}" />
        <Setter Property="FontWeight"
            Value="Normal" />
        <Setter Property="FontSize"
            Value="116" />
    </Style>
</ResourceDictionary>

App.xaml:

<Application
    x:Class="Testing.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Testing">

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ms-appx:///Styles.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>

</Application>

Found the solution:

    <win:FontFamily x:Key="IconScratchedFontFamily">ms-appx:///Assets/PWSmallIcons.ttf#PWSmallIcons</win:FontFamily>
    <macos:FontFamily x:Key="IconScratchedFontFamily">ms-appx:///Assets/PWSmallIcons.ttf#PWSmallIcons</macos:FontFamily>

Background: The part after the # indicates the name of the font, as it is written in the.ttf File , not name of the Font as I want to reference it , which is pretty obvious if you think about it.

It was nearly impossible to figure out with my provided code, so I decided to update my question for anyone else running into this problem.

For Win and macOS the way to define the FontFamily in the Resources is by using just the FontName that in your case it would be something like:

<win:FontFamily x:Key="IconScratchedFontFamily">Small-Icons-Scratched</win:FontFamily>
<macos:FontFamily x:Key="IconScratchedFontFamily">Small-Icons-Scratched</macos:FontFamily>

and

<win:FontFamily x:Key="IconClearFontFamily">Small-Icons-Free</win:FontFamily>
<macos:FontFamily x:Key="IconClearFontFamily">Small-Icons-Free</macos:FontFamily>

With this, you should be able to use your FontFamily definitions in any of your Styles.

Hope this helps.-

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM