用数据绑定在TextBlock中查看图标

Question

I am trying to make a Grid with an Icon in it. I am storing the string representation of the icon in a database, and trying to display these icons in a GridHub by binding to the Icon property (a string) on my viewmodel.

When I use this xaml, I get the actual text displayed in the grid

<TextBlock Text="{Binding Icon}"
    FontFamily="Segoe UI Symbol"
    FontSize="100"
    TextAlignment="Center"
    VerticalAlignment="Top"
    Foreground="DarkGray"
    AutomationProperties.Name="Some Label"/>

But this displays the icon as expected

<TextBlock Text="&#xE1D4;"
    FontFamily="Segoe UI Symbol"
    FontSize="100"
    TextAlignment="Center"
    VerticalAlignment="Top"
    Foreground="DarkGray"
    AutomationProperties.Name="Some Label"/>

My Model looks like:

 public class PermissionGroup
{
    /// <summary>
    /// The unique identifier for the group.
    /// </summary>
    public string PermissionGroupId { get; set; }
    /// <summary>
    /// The name of the group
    /// </summary>
    public string Name { get; set; }

    /// <summary>
    /// The page associated with the permission group
    /// </summary>
    public string PageName { get; set; }

    /// <summary>
    /// The icon that will be shown on the PermissionHub page
    /// </summary>
    public string Icon { get; set; }

    /// <summary>
    /// A description of the permissions in the group
    /// </summary>
    public string Description { get; set; }

    /// <summary>
    /// The permissions associated with this permission group
    /// </summary>
    public List<Permission> Permissions { get; set; } 
}

and my viewmodel just contains a list of these objects.

In my database I have tried storing the following:

1. 
2. \ (has to be escaped to get in the db)
3. 57812 (the result of char.Parse("\") )

and none of these has resulted in the icon being displayed correctly!

The output of first XAML example

Answer 1

You have to decode the html encoded string. For instance you can try this very rough example:

public class ViewModel
    {
        public PermissionGroup PG {get; set;}
        public ViewModel()
        {
            PG = new PermissionGroup();
            PG.Icon= System.Net.WebUtility.HtmlDecode("");
        }
    }




public partial class Window1 : Window
    {
        public Window1()
        {
            InitializeComponent();
            this.DataContext = new ViewModel();
        }
    }


<TextBlock Text="{Binding Path=PG.Icon}" FontFamily="Segoe UI Symbol"/>

or

<Style x:Key="Segoe">
    <Setter x:Name="Segoe" Property="TextElement.FontFamily" Value="Resources/#Segoe UI Symbol" />
</Style>

<TextBlock Text="{Binding PG.Icon}"
            Style="{DynamicResource Segoe}"

A font viewer is available here , in case you need one.

EDIT: anyway the unicode escape sequence should work better than the html encoding, that's why I'm suggesting to double check with a font viewer and to link the font ttf as a resource. You can also add a button to analyse the unicode conversion of your xaml text, when directly entered without binding. Something like this

private void Button_Click(object sender, RoutedEventArgs e)
{
    byte[] stringBytes = Encoding.Unicode.GetBytes(txname.Text);
    char[] stringChars = Encoding.Unicode.GetChars(stringBytes);
    StringBuilder builder = new StringBuilder();
    Array.ForEach<char>(stringChars, c => builder.AppendFormat("\\u{0:X}", (int)c));
    Debug.WriteLine(builder);
}