sly 的个人资料Silverlight and Internat...照片日志列表 工具 帮助

日志


2007/5/25

Using resx files in Silverlight 1.0 (Updated to 1.0 RTW)

You want to app to work outside the US

You have created a great silverlight application but unfortunately but unless you have globalablized, it will only ever have limited reach. Therefore you need to localize and translate it. For a site to be able show different text based on language without having to re-create a different xaml for page you need dynamically reference different text based on the user’s language. For such occasions .net uses resx files.

What are ResX Files?

*.resx files are a .net standard resource file format - http://msdn2.microsoft.com/en-us/library/ekyft91f.aspx  
It is an xml standard that has a set structure, as shown below, that are automatically generated from visual studio, from any text or localizable elements in web site or application.
From this one base file, a localizer can translate the site without messing up the code of the rest of the site or application.

<data name="string1">
    <value>hello</value>
</data>

Silverlight Localization Model

Unlike Silverlight 2.0, Silverlight 1.0 has no localization resource model, that I am aware of. So instead of creating a custom format for your app, we can re-use the .Net standard resx format. In Silverlight 1.0 there is no built-in method to reference or generate these resources, so we need to re-create the ability the reference these.
Since these are simple xml files, it is simple to do in either JS or client side .net

In the example on http://www.geocities.com/sly_i/resx-sample , I have created a small page

BTW: I got no design skills that im aware of ;-)

How this Works

It simply loads a xaml with some basic xaml elements and when the user press’s the mousedown on a button.

  1. I create a download object and load up and read a zipped resx file
  2. Store each loc resource into an array
  3. Then I walk the XAML DOM and look for any textblocks that are name like L_something_text
  4. Replace each item with its corresponding localized/translated string
I hope you found this useful.

Slyi

In my next blog item is wrapping and clipping. I’ll show how to dynamically resize button like objects and canvas based on differing text lengths.
2007/5/23

Displaying unicode in silverlight

The Problem up till now

With the launch of silverlight 1.0 beta at mix, the Faq and forums stated BiDi (eg arabic) and East Asian (eg: japanese) fonts, are not supported in textblock element by default, only glyphs but will be in the final 1.0 release, this summer.
I work on some international sites, so i need methods to display intl charactors, if i want to presude my boss to adopt it. 

From the WPF/E Feb CTP we found you could show japanese text in text block, but only if you had the font available on your webserver. This is not a realistic deployment model, when you need 9mb font file to be downloaded every time.

A designer would be better hardcoding some gif's with the text instead 

A Solution Emerges

In April, the Silverlight beta came the ability to embed fonts. But this is still a 6 mb zipped font file. 
Then a
breakthought came when Mark Rideout said, the plugin allowed obfuscated fonts. They are compressed subsets of the intl fonts used in the doc. So instead of 9mb it only 20k :-)

Then with some tinking of the SDK embedded font example. I could show japanese charactors. http://www.geocities.com/sly_i/jajp/default.htm 

What i needed to do,

1. In vista open a wordpad and type or paste in some asian charactors and click print and select Microsooft XPS Document Writer.
2. A dialog appears and asks for the name and location of the file to be saved, chose c:\test.xps
3. Open c: drive in the explorer and rename file from test.xps to test.zip
4. Extract the odttf from C:\test.zip\Documents\1\Resources\Fonts\9D2A1321-7A9B-4533-8D7D-B58C1539A91D.odttf
5. Open the sdk example http://blogs.msdn.com/silverlight_sdk/attachment/2365400.ashx
6. Replace the odttf font file with the downloader sample fonts in the zip.
6. Save all html, js and xaml files as utf-8 encoding
7. In the textblock use your same japanese charactors and that you used in wordpad
8. Change the fontFamily to the font name in wordpad eg: myTextBlock.fontFamily = "MS PGothic";

NB: Please note, some fonts may have embedding licencing issues.

BIDI Support

Silverlight fonts, support middle eastern ( eg hebrew or arabic) charactors as long as you save everything as utf-8.
But Bi-Directional text flow is not supported yet.
In Javascript the solution is simple, reverse the string text eg: http://www.geocities.com/sly_i/heil/

function reversetext(HEIL_text){
   return HEIL_text.split('').reverse().join(''); 
}

 

Put it all together
 

Then you can view both bidi and east asian text using textblock elements. A basic example is all languages is at

http://www.geocities.com/sly_i/languages

 

I hope this helps you design your silverlight apps to be enabled for international markets.
My next post will be on guidelines for creating a localizable silverlight app using resx and javascript.

 

 

Regards,

Slyi

 

BTW: Please see Laurence Moroney for more silverlight Intl samples http://blogs.msdn.com/webnext/default.aspx