How To Localize an iPhone App - cocoa-touch

Question

I am trying to find a step by step tutorial on how to localize an iphone App. I have english and I'm looking to add french. The documentation is available but it hardly comes close to giving you clear instructions on how to implement it from start to finish.

Answer 1

Below is the step by step walkthrough that I was looking for. It is found Here
Hope it helps all of you as it did m.
This is a guest post by Sean Berry, a developer of math apps for iPhone, iPad, and iPod Touch.
Me Gusta Localization!
Although the English-speaking App Store market is the largest, there are still plenty of other iPhone users in the world and you can greatly increase their user experience by supporting their native language.
The good news is Apple has made it very easy to make your apps work with multiple languages through some API calls and built-in Xcode support. The process of doing this is called localization, and that’s what I’ll be showing you how to do!
In this iPhone app tutorial, you will be localizing a sample app I prepared called iLikeIt which was inspired by the rage comics in Ray’s post about in-app purchases. The app is very simple – it displays some ideal sales data, and when you tap ‘You like?’ a face appears, scales up, and fades away.
But right now it’s English only – so vamos a traducir!
This iPhone app tutorial will be using Xcode 4.6.1, so if you haven’t upgraded already, why not use this as an excuse to do so?
Getting Started
The first step is to download the iLikeIt starter project that we’ll be localizing in this iPhone app tutorial.
Build and Run the app, and you should see the following appear after you tap ‘You like?’:
We have 3 things to localize here:
Text: sales data
UI Element: ‘You like?’ button
and finally the image (it has text!)
Separating text from code
Like most projects, this project has some hardcoded strings in the code. We need to pull all of these hardcoded strings into a separate file so we can localize them.
The way you do this in Xcode is create a “.strings” file to contain all of the strings your projects needs. Then you’ll replace the hardcoded strings with a function call to look up the appropriate string from the “.strings” file based on the current language.
Let’s try this out. Go to File\New\New File. Choose iOS\Resource\Strings File, and click Next, as shown in the screenshot below. Name the new file Localizable.strings, and click Save.
Note that Localizable.strings is the default filename iOS looks for when dealing with localized text. If you don’t use this, you’ll have to specify the name of our .strings file every time.
The format for the strings file is:
"KEY" = "CONTENT";
So for our ‘Yesterday you sold %# apps’ and ‘You like?’ text add in:
"Yesterday you sold %# apps" = "Yesterday you sold %# apps";
"You like?" = "You like?";
Now switch to ViewController.m, and find the viewDidLoad method. Right now it sets the text as:
self.numAppsLabel.text = [NSString stringWithFormat:#"Yesterday you sold %# apps", #(1000000)];
[self.likeButton setTitle:#"You like?" forState:UIControlStateNormal];
We want it to instead read from our .strings file. To do that, change the current line to use a macro called NSLocalizedString as shown below:
self.numAppsLabel.text = [NSString stringWithFormat:NSLocalizedString(#"Yesterday you sold %# apps", nil), #(1000000)];
[self.likeButton setTitle:NSLocalizedString(#"You like?", nil) forState:UIControlStateNormal];
If you’re curious what the NSLocalizedString macro does, control-click on NSLocalizedString and choose Jump to Definition. You’ll find that it’s defined as follows:
#define NSLocalizedString(key, comment) \
[[NSBundle mainBundle] localizedStringForKey:(key) value:#"" table:nil]
So basically, it’s using the localizedStringForKey method to look up the string for the given key, in the current language. It passes nil for the table name, so it uses the default strings filename (Localizable.strings). For full details, check out Apple’s NSBundle Class Reference.
One other thing to note. The macro takes a comment as a parameter, but seems to do nothing with it! This is because instead of manually typing in each key/value pair into Localizable.strings like we’ve been doing, you can use a tool that comes with the iPhone SDK called genstrings to do this automatically (which can be quite convenient for large projects).
If you use this method, you can put a comment for each string that will appear next to the default strings as an aid for the translator. For example, you could add a comment indicating the context where the string is used.
Enough background info – let’s try it out! Build and run your project, and it should say the same text on the main screen just as before. But where’s the Spanish? Now that we’re set up it’s a cinch.
Adding a Spanish Localization
To add support for another language, click on the blue iLikeIt project folder on the left pane, select the Project in the next pane (NOT the Target), and under the Info tab you’ll see a section for Localizations. Click the + and choose Spanish (es).
You’ll see another screen asking you which files you want to localize, keep them all selected and click Finish. It’s ok that you don’t see Localizable.strings yet! We’ll get to it soon.
At this point, Xcode has set up some directories containing a separate version of InfoPlist.strings and MainStoryboard.storyboard for each language you selected, behind the scenes. To see this for yourself, open your project folder in Finder, and you’ll see the following:
See en.lproj and es.lproj? They contain our language-specific versions of files.
‘en’ is the localization code for English, and ‘es’ is the localization code for Spanish. If you’re curious, here’s the full list of language codes.
When iOS wants to get the English version of a file, it will look in en.lproj, but when it wants the Spanish version of a file it will look in es.lproj.
It’s that simple! Put your resources in the appropriate folder and iOS will do the rest.
But wait, what about Localizable.strings? To let Xcode know you want it localized, select it on the left pane, and open the File Inspector in the right pane. There you will see a button labeled Localize, click it, choose English (because it’s currently in English), and finally click Localize.
Now on that right File Inspector panel it shows which languages this file belongs to, add it to the Spanish localization by checking that box to the left of Spanish.
Go back to the left panel and click on the arrow next to Localizable.strings so it shows the sub-elements. You’ll see now we’re working with two versions of this file:
To change the text for Spanish, select Localizable.strings (Spanish) and change the text to read:
"Yesterday you sold %# apps" = "Ayer le vendió %# aplicaciones";
"You like?" = "~Es bueno?~";
Your app is worldly now! Let’s make sure it worked…
To make your simulator show Spanish, go into Settings.app and choose General -> International -> Language -> Espanol.
Delete the app and select Project\Clean to get a fresh build and install. When you build and run you should see:
Locale versus Language
Let’s make that number look better by adding some formatting. Replace this code:
self.numAppsLabel.text = [NSString stringWithFormat:NSLocalizedString(#"Yesterday you sold %# apps", nil), #(1000000)];
With this:
NSNumberFormatter *numberFormatter = [[NSNumberFormatter alloc] init];
[numberFormatter setNumberStyle:NSNumberFormatterDecimalStyle];
NSString *numberString = [numberFormatter stringFromNumber:#(1000000)];
self.numAppsLabel.text = [NSString stringWithFormat:NSLocalizedString(#"Yesterday you sold %# apps", nil), numberString];
Build and Run and the number will be a lot easier to read.
But here’s the thing, in Spain they don’t format their numbers like that. They write “1.000.000″ instead of “1,000,000″, but if you change the iOS simulator’s language to Espanol, you’ll still see commas used to separate the zeroes. The reason being is that number formatting is based on the region/locale, not the language. To see how someone in Spain will see that number, go into Settings -> General -> International and change Region Format to Spanish -> Spain.
When you open up the app again this is what you should see:
We got that functionality for free, just for using Apple’s NSNumberFormatter class! It pays to do things Apple’s way, don’t fight it.
Images
Since we have text in our image we need to localize it. Having some English in an otherwise Spanish app would look amateur.
Select ilike.png and add a localization for Spanish (you’re an old pro at this now!) (if you forgot, select it on the left panel, and in the File Inspector panel on the right, click the Localize button. Then after allowing Xcode to place the default copy into en.lproj, check the Spanish box on the right panel.)
Check out the project folder. ilike.png has been added to the English folder (en.lproj) and then copied to the Spanish folder (es.lproj). To make a different image show up for the Spanish version, we simply overwrite the image in the Spanish folder.
I’ve also included it in the starting project, saved as megusta.png.
Rename it to ilike.png and move it into the Spanish folder (es.lproj), overwriting the copied English version.
Clean and rebuild and you should be done! Switch your simulator to Espanol to see…
Congrats! That’s the bulk of localization.