Mobile App Development & Localisation

Download Report

Transcript Mobile App Development & Localisation

Slide 1

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 2

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 3

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 4

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 5

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 6

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 7

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 8

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 9

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 10

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 11

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 12

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 13

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 14

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 15

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 16

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 17

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 18

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 19

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 20

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 21

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 22

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 23

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 24

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 25

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 26

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 27

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 28

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 29

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 30

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 31

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 32

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 33

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 34

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 35

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 36

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 37

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 38

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 39

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 40

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 41

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 42

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 43

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 44

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 45

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 46

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 47

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 48

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 49

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 50

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 51

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 52

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 53

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 54

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 55

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 56

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 57

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 58

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 59

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 60

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 61

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 62

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 63

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 64

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 65

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 66

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 67

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 68

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 69

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 70

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 71

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 72

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 73

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 74

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 75

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 76

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 77

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 78

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 79

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 80

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 81

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 82

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 83

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 84

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 85

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 86

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 87

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 88

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 89

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 90

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 91

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 92

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 93

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 94

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 95

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 96

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 97

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 98

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 99

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 100

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 101

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 102

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 103

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 104

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 105

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 106

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 107

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 108

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 109

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 110

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 111

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 112

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 113

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 114

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 115

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 116

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 117

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 118

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 119

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 120

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 121

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 122

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 123

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 124

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 125

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 126

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 127

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 128

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 129

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 130

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 131

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 132

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 133

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 134

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 135

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 136

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 137

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 138

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 139

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 140

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 141

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 142

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 143

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 144

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 145

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 146

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 147

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 148

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 149

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 150

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 151

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 152

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 153

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 154

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 155

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 156

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 157

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 158

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 159

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 160

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 161

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 162

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 163

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 164

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 165

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 166

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 167

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 168

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 169

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 170

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!


Slide 171

Mobile App Development &
Localisation
Eric Chubb
Alchemy Software Development
14th June 2012

Overview
• Introduction To Mobile Development (10am –
11.30am)

• Creating Your First Mobile App (12pm – 1pm)
• Localisation Intro & Concepts (2pm – 3.30pm)
• Localisation Using Alchemy Catalyst (4pm – 5pm)

Introduction
• Nice to meet you!
• Developer at Alchemy Software, Dublin for 3 years
• We develop a tool called Catalyst for software localisation
• Allows app developers to translate their software into other
languages
• Implemented Catalyst's Android localisation technology
• Apps published on Android Market

Any Mobile Pros here?
• Do we have any software developers?
• What programming languages do you know?

• Any experience with mobile development already?

Mobile Development Concepts
• We mean software development for smartphones
and tablets, as opposed to desktop computers
• We mean mobile as in fits in your pocket
• Software is distributed in the form of “apps” on
smartphones
• Many smartphone platforms, though really a twohorse race (Android, iOS (iPhone))

What Mobile Platform Do You
Use?
• Android?
• iOS?
• BlackBerry
•…

Why Mobile?

Why Mobile?
• Smartphones are powerful, portable computers with
interesting hardware capabilities
• Touch screens, gestures, cameras, GPS/Mapping,
accelerometry, digital compasses, orientation awareness,
wi-fi, NFC
• A whole wealth of new and enhanced functionalities not
possible on a PC
• Mapping, photography, fitness, games, music, social,
medical / physio monitoring

Why Mobile?
• 330 million Android users, 300 million iOS users – lots of
people buying apps!
• Centralised “app stores” make it easy for customers to
find your apps
• They have disrupted and cannibalised entire market
segments already
• SMS/GSM, Cameras, GPS, MP3 players, electronic
timetables, newspapers, games consoles, keys, CCTV

Mobile Development Challenges
• Like the PC, mobile development has its own unique hurdles
• Developing on unfamiliar platforms with unfamiliar tools
• Fragmentation – lots of device vendors, screen-sizes,
hardware and operating system versions
• Walled Gardens – smartphone platforms are heavily locked
down
• Hardware constraints – finite power sources, memory and
processing power

Mobile Development Challenges
• Non-technical obstacles to contend with as well
• App gold-rush – everybody’s writing apps - of variable
quality

• Low barrier to entry can make it hard for your app to
stand out
• To date, Android and iPhone have 500,000+ apps
EACH
• Coming up with a novel idea or implementation

Not To Worry
• The positives far outweigh the negatives
• Everybody has a phone, now anyone can write their
own software for their phone
• If you’re frustrated by an existing app or the lack of
one you’d use yourself, DIY!

You could be like this guy!

Who?
• Kevin Systrom, founded Burbn in 2010
• Created Instagram, a social photo sharing app which
applies vintage filters/vignettes to digital images
• No formal training in computer science or programming
• Sold Instagram to Facebook for $1 Billion in April 2012,
making $400 Million from that transaction

We’ll Write An App Today
• We will write an app for the Android mobile operating
system
• We’ll get a feel for the concepts and tools involved
first
• We will create a basic app that does something useful

• Finally, we’ll load it into an emulator so you can see it
running

A Bit Of Background First
• Android is a mobile operating system developed by
Google
• First released in 2008 , latest version is 4.0.3
• The most popular mobile operating system by some
distance

• Designed to run on mobile devices of all shapes, sizes
and capabilities

Why Are We Using Android?
• It’s well-documented
• The tools you use to write Android apps are freely
obtainable and multi-platform
• Anyone can download and install the Android SDK

Many Flavours Of Android
• Since 2008, 11 different iterations of Android released
• Unlike iPhone, multiple phone manufacturers use
Android
• HTC, LG, Samsung, ZTE, Motorola, Sony Ericsson…

• Phone manufacturers then usually customise Android
• Sony Ericsson used Alchemy Catalyst in their
customisation toolkit

Android Is Based On Linux
• Optimised for mobile devices (low memory / power
footprint)
• Provides a large set of frameworks and libraries
• Abstracts away device-specific details (most of the
time)

• Open-Source

The Android Stack

Android Apps Use Java
• Android provides a special Java virtual machine called
Dalvik
• Java code is compiled into .dex (Dalvik Executable)
bytecode
• .dex is optimised for minimal memory consumption

• An app’s code, data and resources are packaged inside
an .apk file

Applications Run In Isolation
• An Android application has its own Dalvik Virtual
Machine
• Every application runs inside its own allocated Linux
Process
• Therefore they are sandboxed and isolated from every
other app on the system

What Will We Be Doing?
• We will develop a text editor app
• It will allow you to create, edit and save text files

• We will go through the various steps involved
• Finally, we will load it onto the emulator provide with
the SDK

Before We Continue…
• Any Questions?

What will we be using?
• The Android SDK (software development kit)
• The Eclipse development environment

• The Java Development Kit
• The Android Development Toolkit (ADT) plugin for
Eclipse
• These should be preinstalled on your computers

Android Development 101
• Before we start, we need to know how Android apps
are structured
• They are largely event-driven
• Spend most of their time responding to system / user
events
• The system traps the event - you decide how to
handle it

Android App Components
• Android applications comprise Activities, Services,
Content Providers and Broadcast Receivers
• These serve as the building blocks for your applications
• Every Android App will use a different combination of
the above

Activities

Activities
• An Activity represents a single window in your application
• The UI for that activity is described using a “Layout” which is an XML
document describing a single screen and its controls
• A SMS app would have an activity for sending texts and an activity for
checking your inbox/outbox
• Activities can be launched from outside your application if it permits it
• Activities can also be launched from other activities, when a user clicks a
button for instance in a different activity

Activities
• When an activity is started, it is added to a “backstack” and takes focus
• If the user launches another activity from the current
one, it is halted but its state is preserved in the backstack
• Activities are notified when they are being halted or
paused and can act accordingly

• When a user hits the back button, the current
activity is removed from the back-stack, destroyed
and the previous activity resumes

Services
• A service is a component that runs in the background
for long periods of time
• It does not have a user interface
• An example would be the connectivity service, for
supplying apps with network connections, or the clipboard service for copy and paste
• Services can be launched from Activities

Content Providers
• A content provider is a mechanism to allow applications
to use shared data
• You can implement your own to share your app’s data
with other apps
• Android providers a number of content providers for
retrieving contacts, phone call logs, SMS inboxes etc.
• They are queried using an SQL-like syntax

Broadcast Receivers
• The final component type is the broadcast receiver
• They respond to system-wide announcements
(broadcasts)
• Low battery, photo captured etc. will initiate
broadcasts

• Broadcast receivers allow apps to react to system
events

Intents
• Activities, services and broadcast receivers are all
initiated by intents
• An intent is a message which requests an action to be
performed
• Intents are asynchronous (can send at any moment in
time)

• Intents contain both the action to be performed, and
the type of data the recipient needs to be able to
handle, as a URI

Intents
• Two types of Intent – explicit and implicit
• Explicit intents name the Java class or component to launch
• Implicit intents name the action to be performed and the system
figures out the rest
• Explicit intents are usually used to launch activities contained
within the same app that launches them
• Implicit intents are usually used to launch activities in a different
app

The Manifest File
• A special XML file inside every APK which lists several things:
• The names of components implemented in the app
• What hardware, libraries, services and permissions an app
requires to run
• The oldest version of Android that the app is compatible
with
• What intents the app responds to specifically, using intent
filters

The Manifest File
• If an app uses a specific feature, it must list it in the
manifest
• Devices that don’t have a listed feature won’t install
the app
• Users can see what features an app will use & decide if
they want to install the app
• Failing to declare will cause your app to crash when
your code tries to use the feature

Writing Our App
• We’ll create a very basic text editor
• It can edit, save and re-open files, and copy and paste
• It will show us how activities, intents and services work
• We’ll manage data storage & handle certain user events
• We’ll also get to see how the Android Manifest file works

Writing Our App
• Recall that an activity is a screen in our app
• Our app will have two activities – one for editing, another
for opening files
• The editing activity will have an open button & a save
button
• The “file open” activity will show a list of file names to open
• Holding a filename in this screen will prompt you to delete it

Tune In After The Break
• See you back here at 12pm

Eclipse
• Eclipse is an integrated development environment for
Java
• We can create, edit and debug Android apps using it
• To start it, launch c:\eclipse\eclipse.exe
• It can take a little while to get going!

Let’s Begin
• When Eclipse has loaded, click File->New>Other..>Android>Android Project
• In the “Project Name” field, type “Text Editor”
• Check “Create new project in workspace”
• Click “Next”

Selecting A Build Target
• Here we select the oldest version of Android our app is
compatible with
• Select Android 2.1 (97% of Android phones support)
• Click “Next”

Application Info
• Now we’ll enter some final app information
• Type “Text Editor” as the application name

• Type “com.firstapp.texteditor” as the package name
• Make sure “Minimum SDK” is 7 (Android 2.1)
• Check “Create activity” & call it TextEditorActivity

We Should Now Have An App
• If all went well, you should see the “Text Editor”
project in the left hand side
• Expand the “+” beside the project name to see its
contents
• You should see several folders and some files
• We’ll only focus on some of these files today
• Click on the “src” folder and then on
“com.firstapp.texteditor”

What Are We Looking At?
• You can see “TextEditorActivity.java”
• This contains the code for the main activity in the app

• A bit further down you can see “AndroidManifest.xml”
• This is (you guessed it!) our Android Manifest file

Let’s Start With Our Activity
• Double click on “TextEditorActivity.Java” to see it in
the editor
• Right now, it doesn’t do very much
• We can see it’s a Java class called TextEditorActivity
• It inherits from the “Activity” class provided by the SDK

Adding Imports
• The first thing to do is add references to packages we will use
• Packages are just groups of related code for providing different
functions
• Android provides packages for displaying dialog boxes, opening files etc
• We need to add code to load those packages or our code will cause
errors
• Browse to “imports.txt” and copy the content to the clipboard

Adding Imports
• In the code for our activity, delete everything above
the line public class TextEditorActivity extends
Activity {

• Then paste the code you copied from imports.txt
• As you can see, we’ll be using quite a few of them

onCreate()
• onCreate is the entry point for your Activity’s code
• In this case, we only have one activity, so it’s our entry
point for the entire app
• It takes a “bundle” object as a parameter
• This is just a piece of state that isn’t important to us
right now

onCreate()
• The code in onCreate calls the onCreate method of Activity, our
activity’s parent class
• When we created the app, a default layout was created for our activity
too
• Recall that a layout defines the user interface for an activity
• This includes what controls it contains, their position, and so forth
• The call to “setContentView applies the default layout to this activity”

Our Layout
• Let’s see how our app would look if we ran it now
• In the package explorer, double click on the “res”
folder
• Then double click on the “layout” subfolder
• You should see a file called “main.xml” – double click
on it

Our Layout
• As you can see, it’s just an empty screen with a label on it
• We’re going to some controls to it
• To the left of the activity view you should see some
controls

• If you look inside the different control groups, you can see
there are a lot to choose from

Adding A Text Field
• For now, click on the “text fields” group
• Drag the first control containing “abc” onto the layout
• We now have an editable text field for users to type into

• On the right hand side in the “outline” section you can
see it has an id called “editText1” – we’ll need this ID
later on

Adding Buttons
• Next, we’ll add two buttons, one for opening text
files and one for saving
• Back on the left hand side of the activity view, click
“form widgets”
• Drag the button with the text “button” onto the
layout
• Then do it again

Adding Buttons
• You’ll notice that the controls are being added below each
other
• This is because the specific type of layout we’re using is a
“linear layout”
• There are other types of layout that position controls
differently
• Now, click on each button and resize them so they are as
wide as the activity

Editing Button IDs
• In the outline pane we can see our button IDs with the button
text beside them
• IDs provide a way for application code to reference buttons
• We need more meaningful IDs for our code to work with
• Select “button1” in the outline pane
• You should see a blue rectangle around the top button in the
activity view

Editing Button Text
• Right now the buttons just have the text “button” on them –
let’s change it
• On “button1” outline pane, right click “Edit Text” and in the
field under the “New String” button, delete the content and
type a space
• Do the same for “button2”

Editing Button IDs
• Right click “button1” and click “Edit IDs”
• Type “openButton” , using the same case lettering

• Do the same for “button2”, only change the id to
“saveButton”
• Click Ctrl-s to save your changes

Adding Button Functionality
• Right now, we have two buttons and a text field that
do nothing
• We need to write some code to give them functionality
• Switch back to “TextEditorActivity.java” in the tab list
above the activity view

So What Will We Do?
• We will add two new “OnClickListener”s
• These are pieces of code that are triggered when a user
presses a button
• They specify how an app should react to button presses

Browse to clickListener.txt
• Copy the code in the file and paste it between the last and
second last “}” in TextEditorActivity.Java

• When pasting code, be careful that it is in exactly the right
location
• Otherwise you’ll end up with lots of syntax errors in your
code

Binding the onClickListeners
• We need to associate the onClickListeners with the buttons
• Browse to buttonBind.txt and copy the code
• Paste it under the line “setContentView(R.layout.main);”
• Now, clicking a button will invoke its associated onClickListener
• You’ll notice we also have code to set the text of the buttons…

Saving A File
• Our onClickListeners don’t do anything right now
• We’ll add code so that one of them will save the contents of our
text field
• Browse to saveFile.txt and copy the code to the clipboard
• Paste it under the lines:
View.OnClickListener saveButtonHandler = new View.OnClickListener()
{
public void onClick(View v) {

What Does The Code Do?
• If you look at the comments..
• We generate a random number
• We get the text in the text field in our activity
• We turn that text into a stream of bytes
• We write that stream to a file whose name is the
random number

Opening Files
• Now that we can save files, it would be useful if we could
re-open them!
• Browse to openFile.txt and copy the code
• Paste it under the lines
View.OnClickListener openButtonHandler newView.OnClickListener() {
public void onClick(View v) {

What Does The Code Do?
• It gets the filenames of previously saved files using fileList();
• This is a method provided by the Android SDK
• If the list is empty, we pop up a warning and quit
• Otherwise, we create a pop up containing available
filenames
• When the user selects a file name, we read in that file and
display the text

That’s The Hard Bit Done !
• For the sake of simplicity, we omitted some details (checks
for existing files)
• The file save would also be performed in a separate thread
• However, the app does do what it says on the tin
• Now we want to run it and see it in action!

Running Your App
• To debug your app and see it running, we’ll load it into an
emulator

• The Android Emulator is a piece of software which simulates
a real phone
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• To begin, we need to create an emulator image
• This is a virtual phone on to which your app will be loaded
• It allows you to interact with your app on your development
machine
• We can step through code, line-by-line as it executes and
see its effect

Configuring The Emulator
• On the toolbar above the code editor you should see:
• Click the icon with the red circle to launch the AVD manager

• It’s here that we create an emulator
• In the dialog that pops up, click “New”

Configuring The Emulator
• A configuration dialog will appear – in “name” just type
2.1
• In the “target” dropdown, select “Android 2.1 – API
Level 7”
• We’ve just created a virtual phone running Android 2.1!

• Now, let’s run our app!

Debugging
• To launch your app, in the toolbar click:

• In the pop-up menu, that appears, click “Android
Application”
• If all is well, the emulator should now launch
• After a few seconds, it will launch and you will see
the following:

Play Around With It
• If you click the open button you’ll be told no files are saved
yet
• Type some text into the text field and click save

• Then delete everything in the text field and click “open”
• A pop-up menu will appear and let you select the file you
just saved
• When you click the filename, the contents of the file are
loaded in

Lunchtime!
– Leave Eclipse running, we’ll be using it
in the afternoon!
– See you back at 2pm

Localising Apps with Alchemy
Catalyst
– We will cover software localisation and the
rationale behind it
– Some of the pitfalls of software localisation
– I’ll discuss Alchemy Catalyst, the tool I work on
day-to-day.
– The benefits of using Catalyst

What Is Software Localisation?
• The process of adapting software for different languages / regions

• More than just translating text
• It comprises a complete workflow
– Costing
– Preparation
– Translation
– Review /QA
– Product sign off
• It can range from trivial projects with a few words to entire
operating systems

What are the benefits?
• Allows you to deploy your software globally
• Gives access to more markets and revenue streams

• Microsoft want to sell outside of North America

What Are The Challenges?
• Ensuring translations themselves are correct!
• Translating software without introducing issues (layout
problems, crashes!)

• Cost minimisation
• Internationalisation (localisation-friendly development)

• Workflow management – scheduling, completeness

Translation Challenges
• Ensuring translation quality
• Knowledge of software domain

• Translating content without changing / damaging source
document
• Using correct terminology
• Managing sheer volume of translation to be performed

Post-Translation Issues
• Text expansion / truncation
• Different writing directions – left to right, right-to-left

• Different character encodings

Cost Minimisation Challenges
• Few software companies have resources to localise
alone
• Translation is usually performed externally
• Jobs priced per word – I want to know cost up front
• Reusing translations if possible is desirable

Internationalisation
• Quality of localisation is greatly affected by how
software is made

• Have the developers taken time to expose text for
localisation?
• Or are strings hard-coded into source code?
• Has development made assumptions about text
length, position within sentences?

Localisation Workflow
Management
• Ensuring project finishes on time and under budget and is
of high quality
• Making best use of localisation resources available to you
• Localising in a way that scales from tiny projects to huge
ones
• Using the best tools for the job

What Is Catalyst?
• A Computer-Assisted-Translation (CAT) tool
• Used to localise software, web sites and online help
systems
• Designed to fit in to all stages of localisation workflow

• Automates as much of the process as possible
• Catalyst addresses all of the challenges outlined previously

How Does It Work
• Catalyst accepts 180+ file formats for translation
• Files are organised inside a project file called a TTK
• It breaks content down into translatable units called
“segments”
• A segment can be a word, heading, sentence or
paragraph
• When complete, content is output in format originally
created in

Why Would I Use Catalyst?
• Ensures quality of translations
• Reduces the cost of localisation
• Assists in preparation of material for localisation
• Automates as much of the localisation workflow as
possible
• Breaks the localisation process into more manageable
units

Ensuring Translation Quality
• Catalyst exposes only localisable content for
translation

• Surrounding document / file structure is preserved
• Built-in tests to check for issues introduced by
translation
• Glossary function allows client to use consistent
terminology

Ensuring Translation Quality
• Catalyst can enforce length limits on translations for
graphical applications

• Allows locking of content via keywords and segment locking
• Content can be contextualised with notes (memos) and
reference material
• Status indicators for translations (signed off, for review,
untranslated)

Locks

Keywords

Translation Memory
• Central to Catalyst is the idea of a translation memory
• A database of previously translated content

• Using a TM, Catalyst can suggest translations for
content
• Catalyst can also generate TMs from existing
translations

Translation Memory – How It
Works
• Catalyst checks TMs for translated instances of text
also in untranslated material
• Using a scoring algorithm, it suggests translations
• If multiple candidate translations are found, ranked by
score
• TMs can be other TTKs, online services, text files,
databases

Translation Memory - Benefits
• This lowers the cost of localisation through
translation reuse
• It accelerates the localisation process

• It ensures consistency of translation, especially with
multiple translators
• Assists in initial costing of localisation project

Preparing Material
• Catalyst assists in the pre-translation prep of material
• Calculates the size/cost of localisation project
• Determines amount of translation reuse possible with
TMs
• It can “pseudotranslate” to preview the effects of
localisation
• Pseudotranslation will highlight any unexposed
resources

Project Management
• Rather than use 10 tools for 10 file formats, use 1 for
all of them
• TTKs organise localisation projects into manageable
units

• They can be divided up and distributed to translators
• Translators can work without the tool that created
content originally

Catalyst & Android
• Catalyst is a complete localisation environment for
Android
• It is able to open, translate, visualise and recompile
APK files
• Today we will localise the app you built using Catalyst
10
• We will then load it into the emulator and see it
running, translated

Launch Catalyst
• Browse to Start->All Programs/Program Files->Alchemy
Catalyst
• You’ll be presented with a dialog box – choose “Create
New Project”

Create A New Project

The Workspace
• You’ve just created your first Catalyst project!
• You’re now presented with the Catalyst workspace, made up of
several parts
• The navigator on the left shows your project structure
• The translator toolbar on the bottom displays the current
segment
• The results pane on the right shows any user messages

Inserting The Text Editor App
• Right now our project is empty, so let‘s put something
in it
• We will load the text editor app we created earlier

• First we need to export our app’s compiled APK to disk
in Eclipse

Exporting The APK
• Re-open Eclipse if you closed it earlier
• The Text Editor project should still be in the “package
explorer”
• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”

Exporting The APK
• You’ll be prompted to export the APK file; name the
file “TextEditor.apk” with no space and choose the
C:\ drive as the export location
• Now, switch back to Catalyst
• In the “navigator” pane on the left hand side, right
click on “text editor” and click “insert files”

Inserting Your APK file
• Choose insert files and a file selection dialog will
appear
• Browse to your C:\ drive (there should be a shortcut
in the file selection dialog”
• Make sure you’ve selected “Android application
packages” in the file extension dropdown box

Inserting Your APK file
• Double click on the apk file to insert it
• You’ll be presented with a dialog asking you to “Select
Rule”

• For now, just check “apply to all” and click
“Standard” in the parsing rule list

Your Project
• As you can see, Catalyst has identified the localisable
content in your app
• There are two folders; “layout” containing your app’s
XML layout
• The second folder, “values” contains string resources
• Inside “layout” there is a file, “main.xml” – click on it
to see its contents

The String View
• You’ll notice that the centre pane is now populated
• This is the string view and shows each segment in the file selected
in the navigator
• The first segment is the text in the label above the edit field
• The second are the segments for our buttons, containing a space
• But where is our text “open” and “save” that we saw in the
emulator?

The Visual View
• We can preview our layout visually by switching to
visual view

Our Strings Are Missing
• The problem is that we hard-coded our strings

• This is a big no-no from a localisation point of view
• It means that any changes we make to the file here will be
overridden by our code

• All strings should be externalised into a string file – Android
already provides one!

Strings.xml
• If you look in the navigator, you’ll see a folder,
“values”
• That folder in turn contains a file called “strings.xml”
• We can view the file by switching into String view again
and clicking on it in the navigator

Strings.xml
• We can see two segments, the text for the label in our
layout and the title of our app
• Select the string “Hello World, TextEditorActivity” in the
string viewer

• In the translator toolbar below, the string text will appear
• Edit the string in the toolbar, click back on “main.xml” in
the navigator and switch to visual view

• The eye icon appears beside the string once you edit is the
“for review” status icon, which tells translators the string is
translated but not yet approved

All App Text Should Be In
Strings.xml
• You can see our edits worked because the label text’s
value is stored in Strings.xml rather than being hardcoded

• However, any edits we make to the buttons on our
layout in Catalyst will disappear once we run the app
• The code to set the button text will override any
translations we make

How Do We Fix It?
• We need to make some changes in Eclipse - Re-open it
if you closed it earlier

• Your project should still be visible in the package
explorer on the left
• In the src folder, expand com.firstapp.texteditor and
click on TextEditorActivity.Java
• Delete these two lines

Externalising Strings
• Now that we’ve removed the dodgy code, we need to
add the strings for our buttons to Strings.xml

• In Eclipse’s package explorer, expand the “res” folder
• You’ll see a subfolder called “values”,
• Expand it and you’ll see Strings.xml – click on it
• You’re now presented with a view of strings already in
it

Let’s Add Our Strings
• Click the “add” button and “select” string in the popup that appears
• A new field will appear beside the string list, asking for
the string name and value
• Type “open” in the string name and “Open” with a
capital O in the value field

Let’s Add Our Strings
• Click Add again, selecting “String” once more in the pop-up
• You’ll notice, the string “open” has been added to our string list
• In the fields for the new string, type “save” as the name and
“Save” with capital S as the value
• Click onto the string list and you’ll see the second string being
added
• Press ctrl-s to save the new strings to the xml file

Binding Strings To Buttons
• Now that we have externalised our button text, we
have to bind it to the buttons
• Above the “values” folder in the package explorer,
you’ll see the “layout folder” – click on main.xml inside
it

Binding Strings To Buttons
• You’ll be presented with the graphical view of the layout as
before
• Right-click “openButton” in the outline pane on the right of the
screen and click “Edit text”
• You’re presented with a “resource chooser” – our two new strings
are in the list – double click “open”
• Right-click “saveButton” in the outline and click “Edit Text”,
select “save” from the list
• Press ctrl-S to save the changes

Exporting The APK (again)
• We need to re-export our APK with the changes we
made

• Right click the “Text Editor” project at the top of the
explorer
• Click “Android tools” in the menu that appears and
select “export unsigned application package”
• Save it to your C:\ drive once more, calling it
“TextEditor.apk”

Re-inserting The APK
• Switch back to Catalyst, and select “TextEditor.apk”
• Click the delete keyboard to remove it from your project
• Now, right-click on the “Text Editor” folder and click “insert
files”
• Browse to your C:\ drive and select the “TextEditor” apk file
• Remember to check “apply to all” and select “standard” in the
pop up dialog that appears

Translating Our Layout
• Expand the APK file’s contents and browse to
“strings.xml” inside the “values” folder
• You can now see the text for our buttons
• This is because we correctly externalised our text,
making it easier to localise

• Select one (or both) of the strings in the string viewer
and edit it with some text in the translator toolbar at
the bottom

Translating Our Layout
• You’ll notice that in the navigator, strings.xml AND
main.xml have “for review” icons beside them
• This is because Catalyst has detected that the buttons
in main.xml use text stored in strings.xml
• Click on main.xml, and switch to visual view

Our Translations Now Appear
• You’ll see the edits we made to Strings.xml have
changed the text in the buttons

Exporting Our Translated App
• Now that our app is translated, we’re ready to
create a translated APK
• Right click on “TextEditor.apk” in the navigator and
click “extract file” in the pop up menu
• Save it to your C:\ drive, calling it
“TextEditorTranslated.apk”

Signing Our App
• Before we can install the app, in the emulator, we need to sign it

• This means adding a cryptographic signature to the APK file
• An Android device will not install an app that hasn’t been signed
• To sign the app, open a command prompt by clicking the Windows
“start” button and typing “cmd” inside the “search programs and
files” box, then press enter
• Type the following into the black box that appears:

Signing Our App
• "C:\Program Files\Java\jdk1.6.0_32\bin\jarsigner.exe" -keystore
"C:\my-release-key.keystore" C:\TextEditorTranslated.apk alias_name

• You will be prompted to provide a password to
sign the key, which is simply “password” without
quotes
• If all goes well, the command should proceed
silently

Running Our Translated App
• We’re going to launch an emulator from outside Eclipse and install
our translated app manually
• Launching it inside Eclipse will load the untranslated version
• Open a command prompt by clicking the Windows “start” button
and typing “cmd” inside the “search programs and files” box, then
press enter
• In the box that appears, type this:
"C:\Program Files\Android\android-sdk\tools\emulator.exe" @2.1
• This command starts the emulator and loads the AVD we created

Running Our Translated App
• If all goes to plan, your emulator should display the
Android home screen

Uninstalling Previous Versions
• We need to remove any previous installations of our
app before we install a new one – Android doesn’t allow
overwrites

• In a new command prompt , type
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" uninstall com.firstapp.texteditor
• This will uninstall any previous instances of our text
editor

Installing Our Translated App
• In the command prompt, type:
• "C:\Program Files\Android\android-sdk\platformtools\adb.exe" install C:\TextEditorTranslated.Apk"
• This will install our new, translated app

Running Our Translated App
• Click And Drag the bar with the open padlock icon to
the right
• Next, drag the tab with the arrow up from the bottom
• You’ll be presented with a list of apps, scroll down to
the bottom to find “Text Editor”

• Click on “Text Editor” to launch

We’ve Successfully Localised our
App
• You can clearly see the buttons have been successfully
translated
• The app’s functionality remains unchanged, as it
should:

• Type some text into the edit field and save it
• Then open it again – the app still behaves as normal

Any Questions?
• This is just a very high-level overview of Android development and
localisation
• I’ll give the complete source code to Karl and he can pass it on to
you, along with this presentation
• Alchemy’s Android Localisation tutorial:
http://youtu.be/nNT00ck5iP4

• You can contact me at [email protected]
• Thanks for coming!