Display Xamarin Font Icons From Stored Data - web-services

Question

What is the best way to display font icons with data being pulled from a web service? I want to store the value of the icon and display the icon similar to the rest of the information, but with a custom font icon.
I have a xamarin forms app working with data from a webservice successfully. Here is my model.
public class TypeModel
{
[PrimaryKey]
public int pType { get; set; }
public int fDepartment { get; set; }
public string Title { get; set; }
public string Description { get; set; }
public string Icon { get; set; }
public string Version { get; set; }
}
I also got the font icons working successfully like the tutorial at [1]: https://montemagno.com/using-font-icons-in-xamarin-forms-goodbye-images-hello-fonts/ I got my icons stored under this class. Trying to transition to managing these values with web service or array if I have too now.
public const string IconCheckMark = "\uf12c";
public const string IconSearchGlass = "\uf349";
public const string IconQuestionMark = "\uf2d6";
public const string IconQuestionCircle = "\uf2d7";
But here is where my problem starts. My ViewModel is doing the work to create the collection. How do I assign a value that will display and match correctly.
public ObservableCollection<TypeModel> TypesCollection { get; set; }
TypesCollection.Clear();
IEnumerable<TypeModel> types = await DataSource.GetTypes();
foreach (var key in types)
{
\\Original value doesn't display correctly, shows like \U f 1 2 c when debugging on emulator
\\key.Icon = key.Icon;
\\Works and displays correctly but static data displays one icons for all
\\key.Icon = "\uf12c";
\\Works and displays correctly but static data displays one icons for all
\\key.Icon = FontClass.IconCheckMark;
TypesCollection.Add(key);
}
Nice and simple after that for the xaml files.
<ResourceDictionary>
<OnPlatform x:Key="IconFonts" x:TypeArguments="x:String">
<On Platform="iOS" Value="Material Design Icons"></On>
<On Platform="Android" Value="IconFonts.ttf#Material Design Icons"></On>
<On Platform="UWP" Value="/Assets/IconFonts.ttf#Material Design Icons"></On>
</OnPlatform>
</ResourceDictionary>
<Label FontFamily="{StaticResource IconFonts}" Text="{Binding Icon}"></Label>

Answer 1

What is the type of key.Icon? If it is string, you can remove the white space between the characters by:
key.Icon = key.Icon.Replace(" ", "").ToLower();

Answer 2

Got the answer from Microsoft Dev Community. First to explain what was happening: When you put the following in C# code:
Icon = "\uf2d6"
The “\uf2d6” is not actually a literal string, but rather it ends up being a single character (the one represented by that UTF code) at compile time. In other words the “\u” means that what follows is a hex code for a character and that whole “string” will end up just being that one character. If you inspect the Icon property after the above assignment, you will see that the property only contains a single character, not the “\uf2d6” string.
So when you get “2d6” from your web service in the Icon property, and then try to add “\uf” before it, you are not creating the escape sequence for the character but rather adding to the string literal. So what you need to do is parse the string for the hex number into an int and then cast it to a char and then assign that character to your Icon property. You can do this as follows (put this in the foreach loop in the sample you sent me):
string utfCode = $"f{key.Icon}"; // Adds the leading “f” to make it a correct hex number for the desired UTF code.
int character = int.Parse(utfCode, System.Globalization.NumberStyles.HexNumber); // parses that string literal into an int
key.Icon = ((char)character).ToString(); // casts that int to a char and then gets the string representation for that character and assigns it back to your Icon property
TypesCollection.Add(key);