Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

UI

...

Localization

...

CryENGINE

...

comes

...

with

...

a

...

localization

...

system

...

that

...

allows

...

text

...

localization

...

for

...

the

...

UI.

...


http://doc.mycryengine.com/display/SDKDOC3/Localization

...

Besides

...

string

...

localization

...

it

...

is

...

also

...

possible

...

to

...

use

...

different

...

font

...

and

...

glyph

...

sets

...

for

...

each

...

language.

...

Table of Contents
maxlevel4
ident15px
minlevel1
excludeUI Localization

Basic folder structure

Code Block
Game\Libs\UI\*.gfx                                              <- flash assets
Game\Localized\<language>.pak\Libs\UI\gfxfontlib.gfx            <- font lib for each language
Game\Localized\<language>.pak\Libs\UI\gfxfontlib_glyphs.gfx     <- glyph set for each language
Game\Localized\<language>.pak\Languages\*.xml                   <- translation tables
{code}

h1. String Localization

UI string translations are stored in xml excel sheets. It simply stores labels (keys) and translation.

h2. Translation table

The UI translation tables are located under *Game\Languages&#92;*.xml*. The system loads all xml files in this folder on startup or on language change.
Translation tables for each language must be stored under *

String Localization

UI string translations are stored in xml excel sheets. It simply stores labels (keys) and translation.

Translation table

The UI translation tables are located under Game\Languages\.xml*. The system loads all xml files in this folder on startup or on language change.
Translation tables for each language must be stored under Game\Localized\<Language>.pak\Languages

...

\.xml

...

*

...

For

...

UI

...

translation

...

the

...

tables

...

must

...

have

...

a

...

column

...

"KEY"

...

,

...

"ORIGINAL

...

TEXT"

...

and

...

"TRANSLATED

...

TEXT"

...

.

Image Added

Pass localized string at runtime

A label is also translated if it is passed as string to a dynamic textfield via Code/FlowGraph/LUA.

...

:=|=}
Code Block
title
uielements.xml
borderStyle
none
  <UIElement name="MyElement">

    <GFx file=" MyElement.gfx" layer="2" alpha="1" >
      <Constraints>
        <Align mode="fullscreen" />
      </Constraints>
    </GFx>

    <variables>
      <variable name=" MyTextbox " varname="_root.TextLayer.TextBox.text"/>
    </variables>

  </UIElement>
{
:=|=none} {code}
Code Block
title
cpp
borderStyle
none
IFlashUIPtr pFlashUI = GetIFlashUIPtr();
If (pFlashUI)
{
   IUIElement* pElement = pFlashUI->GetUIElement("MyElement");
   If (pElement)
      pUIElement->SetVariable("MyTextbox", SUIArguments("@somelabel"));
}
{code}

h1. Fontlibs and glyph sets

It is recommended to use *one* font library and glyph set for all flash assets.


One reason is to save memory since you don't want to embed every font in every flash file. This technique also allows embedding different glyph sets for different languages.


It also makes sure that your corporate design is consistent over all UI assets and changes are even easier since it is only necessary to change two files to switch the font for the whole UI.

h2. Setup gfxfontlib and gfxfontlib_glyphs

There are two files that are needed:

{code}

Fontlibs and glyph sets

It is recommended to use one font library and glyph set for all flash assets.

One reason is to save memory since you don't want to embed every font in every flash file. This technique also allows embedding different glyph sets for different languages.

It also makes sure that your corporate design is consistent over all UI assets and changes are even easier since it is only necessary to change two files to switch the font for the whole UI.

Setup gfxfontlib and gfxfontlib_glyphs

There are two files that are needed:

Code Block
gfxfontlib.gfx		<\- font library
gfxfontlib_glyphs.gfx	<\- glyph set
{code}

The *

The gfxfontlib.gfx

...

defines

...

all

...

your

...

fonts

...

that

...

are

...

used

...

in

...

your

...

UI.

...

Since

...

exported

...

fonts

...

in

...

flash

...

always

...

hold

...

every

...

glyph

...

for

...

the

...

chosen

...

font

...

it

...

is

...

necessary

...

to

...

create

...

a

...

gfxfontlib_glyphs.gfx

...

file

...

that

...

allows

...

embedding

...

only

...

the

...

glyphs

...

you

...

want.

...

Setup

...

gfxfontlib_glyphs.gfx

...

This

...

file

...

holds

...

every

...

glyph

...

for

...

every

...

font

...

that

...

is

...

used

...

in

...

the

...

UI.

...


Create

...

a

...

new

...

flash

...

file

...

and

...

name

...

it

...

gfxfontlib_glyphs.fla.

...


Create

...

Dynamic

...

Textboxes

...

on

...

the

...

stage

...

for

...

each

...

font

...

and

...

font-style

...

and

...

embed

...

the

...

needed

...

characters.

...

Image Added

Create an empty dummy MovieClip and mark it for "Export for runtime sharing".

Image Added

Export the gfxfontlib_glyphs.swf

...

file

...

with

...

the

...

following

...

command:

...

}
Code Block
gfxexport.exe \-c \-i DDS \-share_images \-rescale hi  gfxfontlib_glyphs.swf{code}

h3.

...

Setup

...

gfxfontlib.gfx

...

This

...

file

...

defines

...

all

...

fonts

...

and

...

font-styles

...

for

...

the

...

UI.

...


Create

...

a

...

new

...

flash

...

file

...

and

...

name

...

it

...

gfxfontlib.fla.

...

Create

...

new

...

font

...

symbols

...

for

...

each

...

font

...

and

...

font-style

...

in

...

the

...

library

...

(right-click

...

->

...

New

...

font...)

...


Choose

...

font

...

and

...

style,

...

give

...

it

...

a

...

name

...

and

...

mark

...

"Export

...

for

...

runtime

...

sharing"

...

Image Added

Create an empty MovieClip and mark it as "import for runtime sharing" (or just copy and paste the dummy MovieClip from the gfxfontlib_glyphs.fla).

...

This

...

step

...

is

...

necessary

...

to

...

create

...

a

...

dependency

...

to

...

the

...

glyph

...

file.

...

Image Added

Export the gfxfontlib.swf

...

file

...

with

...

the

...

following

...

command:

...

}
Code Block
gfxexport.exe \-c \-i DDS \-share_images \-rescale hi \-strip_font_shapes gfxfontlib.swf{code}

h3.

...

Import

...

fonts

...

to

...

any

...

flash

...

asset

...

Finally

...

you

...

need

...

to

...

import

...

the

...

exported

...

fonts

...

from

...

gfxfontlib.gfx

...

to

...

your

...

flash

...

assets.

...

You

...

can

...

just

...

copy

...

and

...

paste

...

them.

...

Image Added

Export your flash assets with the following command:

Code Block
gfxexport.exe \-c \-i DDS \-share_images \-rescale hi \-strip_font_shapes \*.swf{code}


To use the fonts on your textboxes just choose them in the font dropdown list.

!flash_asset2.png!


NOTE: If you use translation labels for static textboxes you have to make them dynamic\! Otherwise the translation doesn't work.


h2. Different font libraries and glyph sets for different languages

Just create *gfxfontlib.gfx* and *gfxfontlib_glyphs.gfx* files for each language and place them under:

*
Code Block

To use the fonts on your textboxes just choose them in the font dropdown list.

Image Added

NOTE: If you use translation labels for static textboxes you have to make them dynamic! Otherwise the translation doesn't work.

Different font libraries and glyph sets for different languages

Just create gfxfontlib.gfx and gfxfontlib_glyphs.gfx files for each language and place them under:

Game\Localized\<language>.pak\Libs\UI

...

\

NOTE:

...

you

...

have

...

to

...

reload

...

the

...

UI

...

elements

...

after

...

switch

...

to

...

a

...

different

...

language.