NavigationPages UWP Xamarin.FormsでFontAwesomeアイコンを使用するにはどうすればいいですか？

Question

私はAndroidおよびUWPで問題なく、ContentPageでFontAwesomeを使用しています。 （Androidはラベルレンダリングクラスを使用します）。 しかし、NavigationPageをContnetPageに置き換えると、UWPのフォントアイコンが消え、私に正方形が表示されます！ AndroidはNavigationPageで問題なく動作しています。 UWPはAndroidのようにレンダリングする必要がありますか？

public class FontAwesomeIcon : Label 
    { 
     public const string Typeface = "FontAwesome"; 
     public FontAwesomeIcon(string fontAwesomeIcon = null) 
     { 
      switch (Device.RuntimePlatform) 
      { 
       case Device.Windows : 
       { 
        FontFamily= "Assets/Fonts/FontAwesome.ttf#FontAwesome"; 
        break; 
       } 
       case Device.Android : 
       { 
        FontFamily = Typeface; 
        break; 
       } 
       case Device.iOS: 
       { 
        FontFamily = Typeface; 
        break; 
       } 
      } 
      Text = fontAwesomeIcon; 
      VerticalOptions = LayoutOptions.Center; 
     } 

     /// <summary> 
     /// Get more icons from http://fortawesome.github.io/Font-Awesome/cheatsheet/ 
     /// Tip: Just copy and past the icon picture here to get the icon 
     /// </summary> 
     public static class Icon 
     { 
      public static string AngleRight = "\uf105"; 
      public static string User = "\uf007"; 
      public static string Lock = "\uf023"; 
     } 
    } 

アップデート：私はContnetPageでNavigationPageを交換する際に

答えは、我々はしかし、このFontFamily=@"/Assets/Fonts/FontAwesome.ttf#FontAwesome"

Answer 1

を使用する必要がありますされ、UWPフォントのアイコンが消えてくれ広場を示しています！ AndroidはNavigationPageでうまく動作しています。 UWPはAndroidのようにレンダリングする必要がありますか？

あなたのuwpクライアントプロジェクトでカスタムフォントを使用する方法は2通りあります。

FontAwesomeIconクラスのカスタムレンダラーを作成しています。ネイティブコントロールの場合はFontFamilyに設定します。次のコードを参考にしてください。 FontFamilyのパスを確認する必要があることに注意してください。

[assembly: ExportRenderer(typeof(CustomLabel), typeof(CustomLabelRenderer))] 

namespace FontAweSomeTest.UWP 
{ 
    public class CustomLabelRenderer : LabelRenderer 
    { 
     protected override void OnElementChanged(ElementChangedEventArgs<Label> e) 
     { 
      base.OnElementChanged(e); 
      var label = Control; 
      string font = "Assets/Fonts/fontawesom-webfont.ttf#FontAwesome"; 
      label.FontFamily = new Windows.UI.Xaml.Media.FontFamily(font); 
     } 
    } 
} 

他の方法はあなたの投稿に記載されています。私はあなたのコードを修正しました。チェックしてください。

public class FontAwesomeIcon : Label 
    { 
     public const string Typeface = "FontAwesome"; 

     public FontAwesomeIcon(string fontAwesomeIcon = null) 
     { 
      switch (Device.OS) 
      { 
       case TargetPlatform.Windows: 
        { 
         FontFamily = "Assets/Fonts/fontawesome-webfont.ttf#FontAwesome"; 
         break; 
        } 
       case TargetPlatform.Android: 
        { 
         FontFamily = Typeface; 
         break; 
        } 
       case TargetPlatform.iOS: 
        { 
         FontFamily = Typeface; 
         break; 
        } 
      } 
      Text = fontAwesomeIcon; 
      VerticalOptions = LayoutOptions.Center; 
      HorizontalOptions = LayoutOptions.Center; 
     } 

     /// <summary> 
     /// Get more icons from http://fortawesome.github.io/Font-Awesome/cheatsheet/ 
     /// Tip: Just copy and past the icon picture here to get the icon 
     /// </summary> 
     public static class Icon 
     { 
      public static string AngleRight = "\uf105"; 
      public static string User = "\uf007"; 
      public static string Lock = "\uf023"; 
     } 
    } 

私は、NavigationPageをContnetPageに置き換えます。そして、それはかなりうまくいっています。