Internationalization / localization in Silverlight 2 Beta 2

Introduction

Note: this article is specific for Silverlight 2 Beta 2.

What is Internationalization and localization?

Localization and internationalization are the processes of making software capable to display content in different languages depending on the user preferences like described in Wikipedia.

It's a common scenario in business applications to support multiple languages. Development environments often automate the process of internationalizing an application. For example Visual Studio can create local resources for an ASP.NET Page or User Control automatically and in the ASP.NET web application the proper localized strings can be loaded automatically depending on the user preferences without the need for the developer to implement all this functionality.

What about Internationalization and localization in Silverlight?

I spent a few hours in Internet looking for some resources which cover this topic. So I'll try to summarize the process of building an international Silverlight application and will give some examples.

Using RESX files

There is no special tool in the current release of Silverlight Tools for Visual Studio 2008 that can automatically create a local resource for a Silverlight control. That is why we have to create it ourselves.

We have our Page.xaml control with a single TextBlock:

<UserControl x:Class="SilverlightLocalization.Page"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    Width="400" Height="300">

    <Grid x:Name="LayoutRoot" Background="White">

        <TextBlock x:Name="tblHelloSilverlight" Text="Hello Silverlight!"></TextBlock>

    </Grid>

</UserControl>

We want this control to show the text in Spanish whenever the user has chosen Spanish default language in his Internet settings. So we create a folder named "Resources" and put a "Page.xaml.resx" file which will contain the default strings in English and "Page.xaml.es.resx" for the strings in Spanish. For both files we select "Public" in the "Access modifier" dropdown. We put an item with key "HelloSilverlight" to both resource files with text "Hello Silverlight!" for English and "Hola Silverlight!" for Spanish. Then you must go to the Page.xaml.Designer.cs file and make the constructor public:

public Page_xaml() {

}

It's an issue and when you change your "Page.xaml.resx" file the designer will make the constructor internal so you must change it every time.

Visual studio generates classes for the resource files you added so you can access your localized text as follows:

namespace SilverlightLocalization

{

    public partial class Page : UserControl

    {

        public Page()

        {

            InitializeComponent();

            this.tblHelloSilverlight.Text = SilverlightLocalization.Resources.Page_xaml.HelloSilverlight;

        }

    }

}

You may expect this code to work but it doesn't. As it seems Silverlight Runtime does not automatically detect the UICulture depending on the user Internet settings. If you know how to configure the Silverlight application to detect it automatically please let me know. But there is a workaround which I saw here. You should use HTML object instead of asp:Silverlight control an pass it an uiculture parameter like shown in this example:

<div id="silverlightControlHost">

    <object data="data:application/x-silverlight," type="application/x-silverlight-2-b2" width="100%" height="100%">

        <param name="source" value="ClientBin/SilverlightLocalization.xap"/>

        <param name="onerror" value="onSilverlightError" />

        <param name="background" value="white" />

        <param name="uiculture" value="es" /> 

        <a href="http://go.microsoft.com/fwlink/?LinkID=115261" style="text-decoration: none;">

             <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>

        </a>

    </object>

    <iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>

</div>

There is one more issue and workaround. You must open your solution file of the Silverlight project with Notepad and add Spanish to the supported cultures. Visual Studio will request you to reload the project and you must accept.

<SupportedCultures>es</SupportedCultures>

So when you open your page the text is displayed in Spanish. But the UICulture now is hard-coded and will always be Spanish. We can make it depend on the user Internet settings if we are hosting our Silverlight in an ASP.NET page rather than html page:

<param name="uiculture" value="<%=System.Threading.Thread.CurrentThread.CurrentUICulture %>" />

Also make sure that you have set the UICulture to auto in your web.config file:

<globalization uiCulture="auto"/>

Finally this example works. But there wouldn't be a real application with a single TextBlock, so it's not a good idea to set the text for every control in the code behind. You can use binding instead:

<UserControl x:Class="SilverlightLocalization.Page"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:Res="clr-namespace:SilverlightLocalization.Resources"

    Width="400" Height="300">

    <UserControl.Resources>

        <Res:Page_xaml x:Name="PageStrings" />

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">

        <TextBlock x:Name="tblHelloSilverlight" 

            Text="{Binding HelloSilverlight, Source={StaticResource PageStrings}}" >

        </TextBlock>

    </Grid>

</UserControl>

I recommend reading this blog post regarding the advantages and disadvantages of creating resource files per control or per application:

http://wpf-e.spaces.live.com/blog/cns!2B248D261D0E0035!314.entry

We made our example work while facing several issues and working around them. But issues do not end  here. If you try to include one more resource file for a different language you will notice that only the default language and one of the others work. This problem and workaround is described here.

Conclusion

It seems that localization and Internationalization are in fact achievable in this beta stage of Silverlight but with a lot of workarounds and headache. I just wanted to see for myself if it's possible and decided to write this article in order to summarize my experience. I hope that in the official release of Silverlight 2 it will be much easier to create internationalized Silverlight application.

Source code:

www.silverlightshow.net/storage/userfiles/SilverlightLocalization.zip

Reference

I strongly recommend you to read this blog: http://wpf-e.spaces.live.com/. I attribute all the workarounds I made in the example to the creator of this blog.