RTL (Arabic and Hebrew) Support for Windows Phone 7

Tue, February 15, 2011, 11:12 PM under MobileAndEmbedded

Problem and Background

Currently there is no support for Right-To-Left rendering in Windows Phone 7, when developing with Silverlight (itself built on .NET Compact Framework). When I encountered that limitation, I had a flashback to 2005 when I complained about the luck of RTL on NETCF. Unfortunately, the partial solution I proposed back then requires PInvoke and there is no such support on Windows Phone today.

Fortunately, my RTL requirements this time were more modest: all I wanted to do was display correctly a translation (of Hebrew or Arabic) in my FREE WP7 translator app. For v1.0 of the app, the code received a string from the service and just put it up on the screen as the translated text. In Arabic and Hebrew, that string (incorrectly) appeared reversed. I knew that, but decided that since it is a platform limitation, I could live with it and so could the users. Yuval P, a colleague at Microsoft, pushed me to offer support for Hebrew (something that I wasn't motivated to pursue if I am honest). After many back and forths, we landed on some code that works. It is certainly not the most efficient code (quite the opposite), but it works and met the bar of minimum effort for v1.1. Thanks Yuval for insisting and contributing most of the code!

After Hebrew support was there, I thought the same solution would work for Arabic. Apparently, reversing the Arabic text is not enough: Arabic characters render themselves differently dependent on what preceded/succeeds them(!). So I needed some kind of utility that takes a reversed Arabic string and returns the same string but with the relevant characters "fixed". Luckily, another MS colleague has put out such a library (thanks Bashar): http://arabic4wp7.codeplex.com/.

RTL Solution

So you have a reversed RTL string and want to make it "right" before displaying on the screen. This is what worked for me (ymmv).

  1. Need to split the string into "lines". Not doing this and just reversing the string and sticking it a wrapping text control means that the user not only has to read right to left, they also have to read bottom up.
  2. The previous step must take into account a line length that works for both portrait and landscape modes, and of course, not break words in the middle, i.e. find natural breaks.
  3. For each line, break it up into words and reverse the order of the words and the order of the letters within each word
  4. On the previous step, do not reverse words that should be preserved, e.g. Windows and other such English words that are mixed in with the Arabic or Hebrew words. The same exclusion from reversal applies to numbers.
  5. Specifically, for Arabic, once there is a word that is reversed also change its characters.
  6. For some code paths, the above has to take into account whether the translation is "from" an RTL language or if it is "to" an RTL language.

I packaged the solution in a single code file containing a static class (see the 'Background" section above for… background and credits).

Download RTL.cs for your Windows Phone app (to see its usage in action download for FREE "The best translator app")

using RTL.cs

Enjoy, and if you decide to improve on the code, feel free to share back with me…