More Experiments with Xamarin.Forms Cross‑Platform App Development in C# and Emoji

In my previous post I introduced a simple mobile game that I made with Xamarin.Forms. That was pretty basic but I have since made an improved version that I will cover in this post. I also learned far too much about emojis. 😀

Apart from giving you your time in seconds, the new version has a greater set of emoji to use. This means that each board is different every time you play it. I decided to limit the selection to country flags, although there is no intrinsic reason to restrict it to only this character set. It just keeps things simple, which I’ll get into later.

Screenshot 1

Not all emoji are supported on all platforms (or platform versions). In the case of flags this fails quite gracefully and you get the two character country code. Other unsupported Unicode emoji all look the same as each other. Not great for a symbol matching game!

Screenshot 2

So, I simply removed all the unimplemented flags. I also dropped Monaco, as they have the same flag as Indonesia (so although the buttons look the same they don’t match).

Here is the list of country codes I settled upon for targeting Android 6.0.1.

private readonly string[] flags =
{
	"🇦🇩", "🇦🇪", "🇦🇫", "🇦🇬", "🇦🇮", "🇦🇱", "🇦🇲", "🇦🇴", "🇦🇷", "🇦🇸", "🇦🇹", "🇦🇺", "🇦🇼", "🇦🇽", "🇦🇿",
	"🇧🇦", "🇧🇧", "🇧🇩", "🇧🇪", "🇧🇫", "🇧🇬", "🇧🇭", "🇧🇮", "🇧🇯", "🇧🇲", "🇧🇳", "🇧🇴", "🇧🇷", "🇧🇸", "🇧🇹", "🇧🇼", "🇧🇾", "🇧🇿",
	"🇨🇦", "🇨🇨", "🇨🇩", "🇨🇫", "🇨🇬", "🇨🇭", "🇨🇮", "🇨🇰", "🇨🇱", "🇨🇲", "🇨🇳", "🇨🇴", "🇨🇷", "🇨🇺", "🇨🇻", "🇨🇼", "🇨🇽", "🇨🇾", "🇨🇿",
	"🇩🇪", "🇩🇯", "🇩🇰", "🇩🇲", "🇩🇴", "🇩🇿",
	"🇪🇨", "🇪🇪", "🇪🇬", "🇪🇷", "🇪🇸", "🇪🇹", "🇪🇺",
	"🇫🇮", "🇫🇯", "🇫🇲", "🇫🇴", "🇫🇷",
	"🇬🇦", "🇬🇧", "🇬🇩", "🇬🇪", "🇬🇬", "🇬🇭", "🇬🇮", "🇬🇱", "🇬🇲", "🇬🇳", "🇬🇶", "🇬🇷", "🇬🇹", "🇬🇺", "🇬🇼", "🇬🇾",
	"🇭🇰", "🇭🇳", "🇭🇷", "🇭🇹", "🇭🇺",
	"🇮🇩", "🇮🇪", "🇮🇱", "🇮🇲", "🇮🇳", "🇮🇴", "🇮🇶", "🇮🇷", "🇮🇸", "🇮🇹",
	"🇯🇪", "🇯🇲", "🇯🇴", "🇯🇵",
	"🇰🇪", "🇰🇬", "🇰🇭", "🇰🇮", "🇰🇲", "🇰🇳", "🇰🇵", "🇰🇷", "🇰🇼", "🇰🇾", "🇰🇿",
	"🇱🇦", "🇱🇧", "🇱🇨", "🇱🇮", "🇱🇰", "🇱🇷", "🇱🇸", "🇱🇹", "🇱🇺", "🇱🇻", "🇱🇾",
	"🇲🇦", "🇲🇩", "🇲🇪", "🇲🇬", "🇲🇭", "🇲🇰", "🇲🇱", "🇲🇲", "🇲🇳", "🇲🇴", "🇲🇵", "🇲🇷", "🇲🇸", "🇲🇹", "🇲🇺", "🇲🇻", "🇲🇼", "🇲🇽", "🇲🇾", "🇲🇿",
	"🇳🇦", "🇳🇪", "🇳🇫", "🇳🇬", "🇳🇮", "🇳🇱", "🇳🇴", "🇳🇵", "🇳🇷", "🇳🇺", "🇳🇿",
	"🇴🇲",
	"🇵🇦", "🇵🇪", "🇵🇫", "🇵🇬", "🇵🇭", "🇵🇰", "🇵🇱", "🇵🇳", "🇵🇷", "🇵🇸", "🇵🇹", "🇵🇼", "🇵🇾",
	"🇶🇦",
	"🇷🇴", "🇷🇸", "🇷🇺", "🇷🇼",
	"🇸🇦", "🇸🇧", "🇸🇨", "🇸🇩", "🇸🇪", "🇸🇬", "🇸🇮", "🇸🇰", "🇸🇱", "🇸🇲", "🇸🇳", "🇸🇴", "🇸🇷", "🇸🇸", "🇸🇹", "🇸🇻", "🇸🇽", "🇸🇾", "🇸🇿",
	"🇹🇨", "🇹🇩", "🇹🇬", "🇹🇭", "🇹🇯", "🇹🇰", "🇹🇱", "🇹🇲", "🇹🇳", "🇹🇴", "🇹🇷", "🇹🇹", "🇹🇻", "🇹🇼", "🇹🇿",
	"🇺🇦", "🇺🇬", "🇺🇸", "🇺🇾", "🇺🇿",
	"🇻🇦", "🇻🇨", "🇻🇪", "🇻🇬", "🇻🇮", "🇻🇳", "🇻🇺",
	"🇼🇸",
	"🇾🇪",
	"🇿🇦", "🇿🇲", "🇿🇼",
};

Note that these are not normal capital letters and there are two for each country (like UN TLDs). Many emoji are made from compounding multiple characters. However, even when it looks like there is only one character, treating Unicode code-points as literal characters will get you in trouble.

Emoji Woes

Unicode 9.0 emoji are - complex and… extensive. 💩 🏩

The level of support and how they look when rendered varies across platforms and even between different versions of those platforms. Google and Apple emojis look different, which is why WhatsApp uses Apple emojis on every platform. Try typing with the Android emoji keyboard into a chat (rather than the emoji button in the text field) to see this.

There is a big list of the differences here (WARNING‼️ - this is a big list and may hurt your browser). There is a lightweight plain text test set here.

Emojipedia is quite useful, although some of the pages are also rather heavyweight. Their blog highlights some of the differences for new versions of platforms, for example iOS 10, Android 7.0 Nougat and Windows 10 Anniversary Update.

In Windows 10 you can include emoji in your username (and password). For example, you could be a Ninja Cat riding a T-Rex (🐱🐉) or a Ninja Cat on a laptop (🐱💻). This may seem fun but will probably break things and won’t seem so smart when you can’t type it in. In much the same way, using emoji or diacritics in a WiFi SSID will break some clients, even though Zalgo text can be amusing.

I’ll leave discussion of diacritics, internationalisation (i18n) and culture invariant comparisons to another day. It’s almost as complicated as time-zones. However, as long as you stick to UTF-8 and accent/culture insensitive comparisons you should be fine.

Mac

In my next post I’ll be covering how to work with .NET on a Mac. I will compare Xamarin Studio (soon to be Visual Studio for Mac) and VS Code.

Hopefully, it will soon be easy to write a complete solution using Xamarin for apps and ASP.NET Core for the supporting back-end web services. This should increase the potential code sharing and reuse opportunities even further.

P.S. I’m available for hire.


This blog is treeware! If you found it useful then please plant a tree.
Donate a treeDonate a tree🌳🌳