Xamarin表单:字体图标无法在运行时呈现

时间:2017-08-29 17:50:19

标签: android ios fonts xamarin.forms

我正在使用字体在我的移动应用中显示图标。问题是,当我直接将它写入xaml文件时,字体图标会正确显示,但是当我在运行时设置它时它不起作用。

我通过为每个平台创建自定义标签控件和自定义渲染器来实现字体图标。我在Android上遇到这个问题,还没有在iOS上查看过。

自定义标签:

using System;
using Xamarin.Forms;

namespace fonticon
{
    public class IconLabel:Label
    {
        public IconLabel()
        {
        }
    }
}

适用于Android的自定义渲染器:

using System;
using Android.Graphics;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

// This informs the compiler that we're using this class to render an IconLabel on this platform
[assembly: ExportRenderer(typeof(fonticon.IconLabel), typeof(fonticon.Droid.IconLabelRenderer))]
namespace fonticon.Droid
{
    public class IconLabelRenderer:LabelRenderer
    {
        // sets the font for the platform-specific ui component to be our custom font
        protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
        {
            base.OnElementChanged(e);
            // Note we're using the filename here, NOT the font family name
            var font = Typeface.CreateFromAsset(Forms.Context.ApplicationContext.Assets, "flatuiicons.ttf");
            Control.Typeface = font;
        }
    }
}

以下XAML有效:

<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    xmlns:local="clr-namespace:fonticon" 
    x:Class="fonticon.fonticonPage">

    <StackLayout x:Name="mainContainer">
        <local:IconLabel x:Name="lblTestIcon" Text="&#xe012;" VerticalOptions="Center" HorizontalOptions="Center" FontSize="40" />
    </StackLayout>

</ContentPage>

以下代码不起作用:

lblTestIcon.Text = "&#xe012;";

实施的来源如下:

https://blog.bitbull.com/2017/05/10/using-a-custom-icon-font-in-xamarin-forms/comment-page-1/#comment-1209

2 个答案:

答案 0 :(得分:0)

使用以下代码解决了该问题,该代码在文章中被告知,但不知怎的,我错过了它。

Text = System.Net.WebUtility.HtmlDecode ("&#xe012;");

此外,将以下代码添加到Android自定义渲染器:

// sets the font for the platform-specific ui component to be our custom font
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
    base.OnElementPropertyChanged(sender, e);

    // Note we're using the filename here, NOT the font family name
    var font = Typeface.CreateFromAsset(Forms.Context.ApplicationContext.Assets, "flatuiicons.ttf");
    Control.Typeface = font;
}

答案 1 :(得分:0)

我写了blog on using font images,您可能会发现比这种方法有趣且现代。