×
Namespaces

Variants
Actions
Revision as of 14:10, 30 July 2013 by hamishwillee (Talk | contribs)

Series 40: SVG resources localization

From Nokia Developer Wiki
Jump to: navigation, search

This article explains how to localize SVG resources in java midlet application. This is the next article after Game development for Series 40 : adding touch support in wiki article series Rapid game development for Series 40 with NetBeans Visual Designer and Game Builder.

Article Metadata
Code ExampleTested with
Devices(s): Nokia Asha devices range that supports Scalable Graphics (Nokia N31X, Nokia N30X, Nokia N20X)
CompatibilityPlatform Security
Signing Required: none
Capabilities: none
Article
Created: izinin (10 Aug 2012)
Last edited: hamishwillee (30 Jul 2013)

Contents

Introduction

Attractive main menu can be created with use of Scalable 2D vector graphics. SVG menu has lot of advantages than any other approach:

  1. it is scalable -- means you support any device automatically
  2. it is pure artwork and potentially looks nice
  3. it is compact and easier in implementation than Canvas use for graphic menu
  4. you can get access to SVG elements and receive notification from them upon user interaction

In this article we are going to explore direct access to SVG elements in SVG document for text localization. Using one graphic presentation for range of languages that is amazing opportunity to speed-up development!

Before starting

Before going deep in mobile software localization problems, please go through amazingly clear and proved-to-be working tutorial How to create localized text resources created by grahamhughes . Having that localization approach in hand all we need is somehow to access SVG element by ID and alter it.

How to access SVG element in SVG document

SVG document is a XML based document follows scheme declared and maintained by W3C consortium. Every element can be given a string ID. java SVG supporting package allows to find element by ID. To alter its value trait "#text" is used. Please see function implementation below.

    void localize(GameMIDlet midlet, String ID, int localizedID) {
SVGElement text = (SVGElement) svgDocument.getElementById(ID);
if(text != null){
text.setTrait("#text", midlet.locText[localizedID]);
}
}

This function can be found in TouchSVGMenu class implementation of fifteenpuzzle application project source code. In the code fragment midlet.locText[localizedID] call gets string resource from a resource array, instantiated in the midlet.

How to detect device language and select proper resource

Query the current locale of the device using "microedition.locale" attribute :

String locale = System.getProperty("microedition.locale");

the result string follows ISO_639-1 standard. With help of How to create localized text resources tutorial let's build real application, again, all referenced materials are in How to create localized text resources and fifteenpuzzle application project source code. Please find directory "tools" here where you can see text localization resources sources for languages English, Finnish and Russian, resource conversion tool and its source code.

Summary

This article demonstrates advantages of using Scalable Graphics in Series 40 applications. Please see screen shot below taken with Nokia Remote Devices service and fifteenpuzzle puzzle game application project

60 page views in the last 30 days.

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×