Three ways to Fix broken Icon Font in Xamarin App

What to do when suddenly your Icon Font is displayed incorrectly? Here we will get ways to fix that with couple simple steps.

Time to time, when you run your app in Android, iOS or even in UWP in one of the platform or all at the same time you can get unexpected undefined icons or binding Path visible instead of the icon itself. When it can happen? — Here is all pretty simple 🤓. If it works before and now stops, the most popular reasons for that are:

  • 1️⃣ Updated font with new icons.
  • 2️⃣ Re-deployed app cache font and now it’s invalid
  • 3️⃣ Switched between branches with different versions of
  • 4️⃣ *Added with

The First Way to Fix

I assume that you are smart guys and already make clean-rebuild in your IDE, but it does not help. Ok, this step may fix like 85%. We need just delete it manually, from iPhone Simulator or Android Emulator or Windows Menu(for UWP). I know, I know, this is a pretty simple step and stupid, but this is not so not obvious at the beginning and what is most important — quite useful. After this step just deploys the app once again.

I’m working from MacOS, so input the first picture from Google were shown how to remove the UWP app 🤪

The Second Way to Fix

If First way doesn’t help, don’t worry, now you should open in Finder(macOS) or Explorer(Windows) root folder of your project and find all and folders. And just remove them all. And if you try to start a solution right now — you probably will get an error. And this is ok, seriously! Now you need just on the solution level and rebuild your solution and deploy.

This should fix 99% of bugs.

If nothing helps — The Third Way to Fix

Ok, what we have here — nothing helps yes? This quite unusual behaviour. Visual Studio or Visual Studio for Mac mostly can blend your file with and compile it correctly, but Rider has problems with it, so hard that it can work than in next build fails and after that works again.

If you open your file for edition and search for your font you may find that Rider IDE firstly ignore it to compile and after that adds once again like . And this is a root of our problem, as I wrote above most IDE still blend and compile this correctly, but not Rider. Just remove the part with line from your file:

Now I listed all that can fail and fix problems with icon fonts in Xamarin Apps for me. If you know what else can help or what else can fail and why, please be free to let me know at Twitter @bbenetskyy, I will be very glad to know them all 🤩

Bonus Part from OTempura — Scripts to Cleanup

In this bonus part, I will show you scripts to automatically remove and folders for your solution, special thanks to OTempura for help and for an idea 😎

This is awesome, but for Windows mostly, right now in my Mac, I don’t have Power Shell installed and don’t want to, so, the same solution for Mac users 😝

Note will work only if you run that script from a folder with file, otherwise you need to provide to that file 😉

Microsoft MVP | C# .Net | Xamarin

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store