Xamarin 中的 FontAwesome 形成 UWP

Posted 2023-03-25

【中文标题】Xamarin 中的 FontAwesome 形成 UWP

【英文标题】：FontAwesome in Xamarin forms UWP

【发布时间】：2018-06-27 19:36:36

【问题描述】：

我有一个使用 Fontawesome 在 android 中工作的自定义渲染器。 我正在关注本指南using font awesome in UWP 使用自定义标签类型来尝试让 Fontawesome 在 UWP 中工作。

public class FontAwesomeLabel: Xamarin.Forms.Label    
    public FontAwesomeLabel()        
        switch (Device.RuntimePlatform)
      
           case Device.UWP:
                FontFamily = @"/Assets/FontAwesome.otf#FontAwesome";
                break;
        
    

字体 被加载为 ttf 和 otf。这两种类型我都试过了。 他们评估字体具有构建动作“内容”

mainView.Children.Add( new FontAwesomeLabel()
      Text = FaConstPool.FASearch ,FontSize = 40);

public static string FASearch = "\uf002";

仅适用于 Android，不适用于 UWP

我看到了一个奇怪的框，而不是 Android 上预期的 Fontawesome 图标。

任何想法我做错了什么？

【参考方案1】：

问题的解决方案原来是在 UWP 中，使用正确的字体系列名称。 Font Awesome 5 Free Solid 而不仅仅是“FontAwesome”

 // FontFamily = @"/Assets/FontAwesome.otf#FontAwesome"; // incorrect font family name
    FontFamily = @"/Assets/Fonts/FontAwesome.otf#Font Awesome 5 Free Solid";

对于任何对细节感兴趣的人： 我下载了一个字体编辑器来检查内部字体名称和字体系列名称。我犯了错误的代码复制使用类似/旧字体的值的博客文章。实际内容见图片。

我需要解决两种类型的解决方案： 1) 共享代码/.netStandard Common 项目中的自定义控件。 2) 自定义渲染器

解决方案 1：自定义标签

public class FontAwesomeLabel: Xamarin.Forms.Label

    public FontAwesomeLabel()
    
        switch (Device.RuntimePlatform)
        
           case Device.UWP:
             // make sure the correct font family name is used. Check in a font editor
               this.FontFamily = @"/Assets/Fonts/FontAwesome.otf#Font Awesome 5 Free Solid";
                break;
        
    

解决方案 2：标准控件上的客户渲染器

[assembly: ExportRenderer(typeof(Label), typeof(FontAwesomeLabelRenderer))]
namespace Oxando.UWP.CustomRenderers

public class FontAwesomeLabelRenderer : LabelRenderer

    protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
    
        base.OnElementChanged(e);
        if (Control != null)
        
            // on UWP be sure use the Font Family name.
            // get a font editor and check the name, if it doesnt match UWP wont load it
            if (FontAwesomeUtil.CheckIsFA(e.NewElement.Text))
            
                Control.FontFamily = new FontFamily("/Assets/Fonts/FontAwesome.otf#Font Awesome 5 Free Solid");
            
        
    

internal static class FontAwesomeUtil

    public static bool CheckIsFA(string text)
    
        if (text.Length == 0) return false;
        if (text.Length > 1 || text[0] < 0xf000) return false;
        return true;
    

字体编辑器中显示的实际内部名称

【讨论】：

谢谢 CoCaIceDew 你的权利。我试图为其他人记录答案，却忘记标记为已回答。

【参考方案2】：

在UWP上添加字体的正确路径是/Assets/Fonts/FontAwesome.ttf#FontAwesome，看来你必须添加Fonts文件夹。

像这样：

此外，您可以使用Iconize plugin 并检查此答案：

How can I display a font awesome glyph in XAML/C#

【讨论】：

我尝试将字体移动到一个目录。没有运气。不知道为什么需要这样做。

也许您应该为此使用Iconize plugin。

我安装了 Iconize.UWP，如果我知道如何使用它，我会使用它。我无法弄清楚如何在后面的代码中使用它来设置自定义标签类型。