Xamarin Forms Font Awesome 图标未在 UWP 中正确显示

Question

我有一个 Xamarin Forms v4.2 解决方案，我想在其中使用一些 Font Awesome 5 图标。我已将 Font Awesome TTF 文件添加到我相信的正确位置，并根据平台正确设置了文件属性。但是当我尝试使用 FA 图标时，iOS 和 Android 会正确显示，而 UWP 会显示一个正方形来代替图标。我已经包含了 App.xaml、Page.xaml 和常量帮助程序文件的代码 sn-ps，以及 UWP 文件位置的图片和每个平台显示的图片。我相信这与 UWP 找不到字体文件有关，因为其他两个平台都可以正常工作。但我已经能够解决这个问题。

--- App.xaml ----
<OnPlatform x:Key="FontAwesome5FreeRegular" x:TypeArguments="x:String">
    <On Platform="iOS" Value="FontAwesome5Free-Regular" />
    <On Platform="Android" Value="fa-regular-free-400.ttf#Regular" />
    <On Platform="UWP" Value="Assets/Fonts/fa-regular-free-400.ttf#Font Awesome 5 Free Regular" />
</OnPlatform>

--- Helper class for constant codes ---
public static class IconFontAwesome5FreeRegular
{
    public const string Heart = "\uf004";
    public const string Star = "\uf005";
}

--- Page.xaml  ----
<StackLayout HeightRequest="100" Orientation="Vertical">
    <Label
        FontFamily="{StaticResource FontAwesome5FreeRegular}"
        FontSize="44"
        HorizontalOptions="CenterAndExpand"
        Text="{x:Static fontawesome:IconFontAwesome5FreeRegular.Heart}"
        TextColor="Red"/>
</StackLayout>

图片 1 - iOS 图 2 - UWP 图 3 - 安卓 图 4 - UWP 项目文件位置

Answer 1

我下载了 fa-regular-400.ttf，在 Android、UWP 中添加了这个，它在我身边运行良好。

在 Android Assets 中添加 fa-regular-400.ttf，将属性更改为 AndroidAssets，同时在 UWP Assets 中添加 fa-regular-400.ttf。

在 App.Xaml 中创建 FontFamily 样式

 <Application.Resources>

    <ResourceDictionary>

        <Style x:Key="FontAwesome5FreeRegular" TargetType="Label">
            <Setter Property="FontFamily">
                <Setter.Value>
                    <OnPlatform x:TypeArguments="x:String">
                        <On Platform="iOS" Value="Font Awesome 5 Free" />
                        <On Platform="Android" Value="fa-regular-400.ttf#Font Awesome 5 Free Regular" />
                        <On Platform="UWP" Value="Assets/fa-regular-400.ttf#Font Awesome 5 Free" />
                    </OnPlatform>
                </Setter.Value>
            </Setter>
        </Style>
    </ResourceDictionary>



</Application.Resources>

 <Label
        BackgroundColor="White"
        FontSize="36"
        HeightRequest="100"
        Style="{StaticResource FontAwesome5FreeRegular}"
        Text="&#xf004;"
        TextColor="Black">           
    </Label>

在 Label 样式中使用 FontAwesome5FreeRegular 样式，我在 Android 和 uwp 中得到相同的。

您也可以查看以下文章以获得帮助。

https://www.wintellect.com/using-fontawesome5-xamarin-forms/

https://www.msctek.com/font-awesome-xamarin-forms-xaml/

关于icon unicode，请参考：

https://fontawesome.com/v4.7.0/cheatsheet/