Live editing translations in an Android application

Michal Borkowski
Kunstmaan | Accenture Interactive
4 min readApr 10, 2018

A tool that allows you to edit the translations from your application at run-time, so you can immediately see and share the changes.

The process of writing copy for a mobile applications can be quite complicated, especially when it is done by a copywriter:

  • Provide them with access to the repository of your application? But, then the copywriter needs to be at least tech savvy, and you have to be willing to share your code.
  • Or do you give him a working application and a list of Strings? In that case, the copywriter can’t see the effect of the changes they make.

At Kunstmaan | Accenture Interactive we decided to develop a library that will simplify the whole process: we provide the copywriters with a version of the application tailerod for them.

And once the translation is done all the changes can be shared from the application in a format defined by the developer.

Setup

Let’s now go through the steps for adding this library to your own apps.
Before we begin, just a notice: we’re using 2 libraries here. kunstmaan-shaker-menu is a utility library that allows us to show a popup menu after shaking your phone, and kunstmaan-translations-editor is the actual translations tool.

Begin by adding the libraries as gradle dependencies. Our recommended approach is to only use the library in either debug or alpha builds, and not in beta or production.

Define the strings.xml files that we want to use in the library.
Let’s say we have a default strings.xml (without any modifier) used by our default locale (en_US) and a file for Dutch and French Locales with the same strings as the default one but untranslated (strings.xml (fr) strings.xml (nl) ).

Then we build our library with those Locales,.
We also need to specify what is our default Locale and provide the fields from R.string and the Application context.

Once the Translations library is setup, we’ll initialise our shake detection popup menu that can start the Translations tool from any activity.

Usage

At this point, everything should be good to go and we can start translating!

Shake your phone on the screen to be translated and choose the popup menu item we setup earlier.

The strings are divided into 3 categories :

  • Current : Strings from the current view
  • In memory : Strings present in memory
  • All : All Strings of the application
We can see the Strings that are present on the screen we came from. Let’s edit them.
We also can see and edit the version of this string in other Locales
Now we want to see the changes in the application, we just have to press the “Apply Changes” button, and the app will restart with your translation changes applied.

Additional features

There are a few extra features provided in our tool:

Add a pattern that the library will ignore.

Let’s say you are using a library you use to debug or simply you don’t want some of your strings to appear in the translations list. You can use a regex to specify which keys from strings.xml should be ignored.

E.g.: this regex that compiles to “all words beginning with to_be_ignored”

makes that this string (from strings.xml) will not be shown in the translations list (no matter if it is on the screen or not).

Set a custom format for the file that will be shared.

The Library provides two default formats for the Strings you share, xml and json :

If this defaults doesn’t suit your needs, you can specify your own.
Use this placeholders in a string and they will be replaced with the value they represent :

  • ${key}
  • ${locale}
  • ${newValue}
  • ${oldValue}

will give this output, when shared in json :

Search for strings in the list.

On each screen (Current, In memory, All) you can search for strings.

The search will be performed on the keys and values.

Filter changed/unchanged values.

I you want to see only the values that are changed or unchanged, the overflow menu has buttons to filter those values.

The translations library and shaking detection library can be found on GitHub with working examples:

Kunstmaan Translations Editor

Kunstmaan Shaker Menu

Originally published at labs.kunstmaan.be

--

--