inmeta crayon as

Inmeta Crayon ASResource management in WinRTJonny Bekkum.NET Architect and Developer at InmetaCore developer CSLA.NET

.NET Code

• Resx – filetype• Codegen Resources.designer.cs• Translation is convention based on filename,

Resources.<cultureName>.resx for translated resources• Default resource file in project properties.

.NET Deployment

• Default resources.resx embedded in assembly.• Translated resources compiled into satellite assemblies

<cultureName>\<assembly>.resources.dll

.NET

• DEMO

WinRT Code

• New filetype .resw (same XML specification as resx)• No codegen, no default resource file• Convention based on file structure and files must have

identical filename.

WinRT Compile

• Resw files is compiled into pri files by makepri.exe • Resources per project is compiled into <AssemblyName>.pri

WinRT Deploy

Application• ALL language resources for application and libraries is

merged into a common tree (ResourceMap) and placed in resources.pri

• Resouces.pri must be deployed with your application

Package Resource Index (.pri)

• The PRI contains actual string resources, and an indexed set of file paths that refer to the files in the package.

• Packages typically contain a single PRI file named resources.pri.

• PRI files are data-only and are not of the PE format. They are specifically designed to be data-only as the resource format for Windows. They replace resources contained within DLLs in the Win32 app model.

• Use makepri.exe /dump to see the content of the .pri file.

Load resources by ResourceLoader

• Application var rl = new ResourceLoader(); // default is “Resources” var stringVal = rl.GetString(<resourceName>);

• In an assembly var rl = new ResourceLoader("<AssemblyName>/Resources"); var stringVal = rl.GetString(<resourceName>);

• In a custom resource tree var rl = new ResourceLoader("<AssemblyName>//<Custom>"); var stringVal = rl.GetString(<resourceName>);

Load resources by ResourceManager

• Windows.ApplicationModel.Resources.Core.ResourceManager• Requires more knowledge of the ResourceMap• Can retrive other types than string (=> StorageFile)• Can enumerate through/inspect all possible values

WinRT - resources

• DEMO

Image localization in Xaml

• If you are referencing the image from XAML, localizing an image is as simple as creating folders for the locals you need to support and put localized versions of the image file into the local folder

• And referencing the image in XAML is the normal relative URL without the culture code as shown in the following example.

Image localization in code

• Using a relative URI to reference package content is not permitted in Metro XAML apps. Instead you have to use an absolute URI using the ms-appx scheme.

Contrast and scale conventions

• High Contrast : • contrast-black • contrast-white

• Pixel Density: • scale-80 (start screen only) • scale-100 (normal DPI, no scaling)• scale-140 (1920*1080, minimum DPI 174)• scale-180 (2560*1440, minimum DPI 240)

Image scaling conventions

Use scalable vector graphics - SVGOr use resource loading for bitmap images:• Option #1 - File naming convention:

• \test.scale-100.jpg • \test.scale-140.jpg • \test.scale-180.jpg

• Option #2 - Folder naming convention: • \scale-100\test.jpg • \scale-140\test.jpg • \scale-180\test.jpg

WinRT – image localization

• DEMO

.NET and WinRT side by side

• So you have business / framework code in NET that you want to share into WinRT projects?

• Code can be linked into other project• Then there’s the case of resource strings

• Copy .resx files to new folder structure and name .resw• Create your own Resources.Designer.cs so you can use

resource strings as in .NET. • Use ResEx to update your resource files.• Only one master set of resx – files

NET and winRT

• Makepri.exe has better checks than .NET compiler• Allowed languages (not supprort for legacy languages)• Invalid language name causes duplicate name causes errors• Resources in localized languages only causes warnings

• Start wth default language and add languages one by one.

Net and WinRT

• DEMO

Summary

• Understand resources and assets is handled in WinRT• Understand how to localize and style your Windows Store App• Understand ResourceMAP and PRI files.• Share code between .NET and WinRT.

Resources

MSDN• Guidelines for scaling to pixel density• Resource Management System• Choosing your languages

Windows 8 Recipes • Building Global Windows 8 Metro XAML Apps Part 1• Building Global Windows 8 Metro XAML Apps Part 2 • Building Global Windows 8 Metro XAML Apps Part 3

Resources

• ResEx - the composite, translation friendly .NET Resource editor.

• ILSpy - the open-source .NET assembly browser and decompiler.

Thank you

• Mail: jonny.bekkum@gmail.com• Blog: http://jonnybekkum.wordpress.com