Label in storyboard don't take the right localization value
Asked Answered
D

3

7

I've built an application and now it's time to translate it to different languages. But some labels that I think I have localised don't get displayed in different languages with the different values.

Image one: So first, I've added the Swedish language inside

"Project -> Localizations"

img1

Than I went inside the "LaunchScreen.storyboard" and edited the file. This one: img2

Edited to this: second

After that I made sure my launch screen supports the language like this: this

And for the last step.. I edited the application language to Swedish like this: enter image description here


But when I run it on the simulator, the text is not getting translated. It still remains the same text, and I've no idea how to solve it. Do you? Do not hesitate to help me out, I would really appreciate it!

So, I'm not sure if I've to add some code or whatever to make this work, but I followed a guide, and they don't. That's one of the reasons why I'm so confused. And thanks in advance!

BEFORE DISLIKE: At least give me a reason for it, so I can improve it in the future!

Delicatessen answered 8/3, 2019 at 11:36 Comment(9)
It's your job to make translation for the language you have selected. The app won't automatically make the translation job for you.Divisive
@ElTomato Nono, of course. But as you see I added "123123123123" just to try it out, but when I enter the application with the correct language it dosent change. It remains the normal string.Delicatessen
Oh, I see. Sorry about that. Don't make the storyboard localizable, though. Use a localizable string file.Divisive
@ElTomato How can I do that?Delicatessen
Create a file titled Localizable. Then change the file type to strings. Put all translation strings in it.Divisive
@ElTomato Do you mean like this: imgur.com/a/kF7ipJE ?Delicatessen
Yes. It looks fine.Divisive
@ElTomato imgur.com/a/CI5yXsi -> Now I've this. Do I have to add any additional code or something to make it work? Cuz when I ran it, it was still the sameDelicatessen
You have to give a localizable string to each control that has a text label. (UILabel, UISegmentControl, UIButton...) For example, myLabel.text = NSLocalizedString("8wr-FC-Rkg.text", comment: "") If you need more assistance, ask Google.Divisive
T
8

Since storyboards elements ids changes and they are not managable to be used as "keys" in your localized "key-value" pair one better solution when localizing storyboards (UI) elements could be to provide a custom User Define Attribute defined as a Locale Key to be used for that UIView.

Then you can define in your Storyboard Attribute Inspector for a specific UI View an input field that will be filled with the localized key defined in your Localizable.strings files (one for English one will be for Swedish, both should have the same keys but with different values - in the English one will have english translations in values, and in Swedish one the opposite.

1) For example since you want to localize a UI View UILabel than you can have this in a swift file Localizable.swift for example (the code makes possible:

import UIKit

// MARK: Localizable
public protocol Localizable {
    var localized: String { get }
}

extension String: Localizable {
    public var localized: String {
        return NSLocalizedString(self, comment: "")
    }
}

// MARK: XIBLocalizable
public protocol XIBLocalizable {
    var localeKey: String? { get set }
}

extension UILabel: XIBLocalizable {
    @IBInspectable public var localeKey: String? {
        get { return nil }
        set(key) {
            text = key?.localized
        }
    }
}

2) You can uncheck your storyboard translations so you will endup having 1 storyboard without duplicating the storyboard into multiple translated version.

3) You can create now a Localizable.strings file containing your keys and translations and localize this file in order to have your translations (as you did with the storyboard, but instead of localizing the storyboard into multiple translated version, you will localize the Localizable.strings file (so you will see two files after you localize that in both languages, one will be called Localizable.strings (English) and the other Localizable.strings (Swedish).

Your Localizable.strings (English) could look like this for example:

"main_page_title_label" = "Main Page Title in English";

Your Localizable.strings (Swedish) could look like this for example:

"main_page_title_label" = "Huvudsida Titel på engelska";

4) Now go to your LaunchScreen.storyboard which you should have un-localized so you only have one version of it and not two like in your example pictures (English, Swedish). Look for the UILabel you want to localize and under the Attribute Inspector you will see a new input field called Locale Key here you can put as a value main_page_title_label. And now you have just localized a UILabel in your storyboard. enter image description here

5) To test it from the simulator you have to change the language in Edit Scheme > Run > Options > Application Language and after you save it you can now run the app in the simulator and it will simulate that your simulator OS system will be set to Swedish language, so the label set with that key will show the Swedish value for that key. enter image description here

Supporting more UI Views (UIButton, UITextField, UISearchBar..)

If you want to be able to localize more UI View, and not just UI View of type UILabel than you can add more support to the Localizable.swift file.

If you want to be able to localize also a UI View of type Button you can add this to Localizable.swift:

extension UIButton: XIBLocalizable {
    @IBInspectable public var localeKey: String? {
        get { return nil }
        set(key) {
            setTitle(key?.localized, for: .normal)
        }
    }
}

To support localization in storyboards for UITextField and UISearchBar placeholder text add this to your Localizable.swift:

// MARK: Special protocol to localizaze UI's placeholder
public protocol UIPlaceholderXIBLocalizable {
    var localePlaceholderKey: String? { get set }
}

extension UITextField: UIPlaceholderXIBLocalizable {

    @IBInspectable public var localePlaceholderKey: String? {
        get { return nil }
        set(key) {
            placeholder = key?.localized
        }
    }

}

extension UISearchBar: UIPlaceholderXIBLocalizable {

    @IBInspectable public var localePlaceholderKey: String? {
        get { return nil }
        set(key) {
            placeholder = key?.localized
        }
    }

}
Teagan answered 8/3, 2019 at 13:5 Comment(3)
I'll try that out a bit later today, thanks a lot for your effort. Only one question: Do I need to go through all labels. (Since there is a loooooot) and add like: label1.text = NSLocalizedstring("", "") etc? or can I perform it all using one page somehow? Or do I manually has to add the NS-string to all labels and buttons? Thanks!Delicatessen
The answer I gave is to be used to localize hard coded strings that are meant to be used in storyboards (UI) and you have to manually add the locale key throught the Attribute Inspector > Locale Key input field for each hard coded text in your UI View. For hard coded strings/text that you set programmatically through swift with myview.text = .. you have can use as you said NSLocalizedString("your_key", "") for every hard coded string you wish to localize in multiple languages and as well add each different key in all your Localizable.strings version with their respective translated valueTeagan
What a fabulous answer! Detailed and really helpful. Thanks!Lancelancelet
P
1

I like denis_lor's solution, but I thought that I first want to get working what should be working already (translation of the storyboard with a simple strings file) without having to re-implement that functionality in a similar way.

My problem was similar to what is described in the question. Translations were already working to a point, but manually added and some changed translations didn't get translated at all.

The solution I found was recreating the strings file using ibtool:

ibtool AppName/Base.lproj/Main.storyboard --generate-strings-file tmp.strings

After backing up my current (just partly working) Main.strings file (AppName/de.lproj/Main.strings) I overwrote it with the newly generated tmp.strings

mv tmp.strings AppName/de.lproj/Main.strings

And then I manually changed the values of that file to the backed up values.

Now everything gets translated correctly again. I think the problem could have had something to do with encoding problems, because that strings files are UTF16 encoded.

Pulmonate answered 12/7, 2019 at 9:40 Comment(0)
A
0

According to Apple docs, the LaunchScreen.storyboard is static and shouldn't have texts because these texts will not be localized.

Avoid including text on your launch screen. Because launch screens are static, any displayed text won’t be localized.

source: https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/launch-screen/

Abbreviated answered 16/9, 2019 at 22:13 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.