Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Label in storyboard don't take the right localization value

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!

like image 243
Putte Avatar asked Mar 08 '19 11:03

Putte


1 Answers

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
        }
    }

}
like image 129
denis_lor Avatar answered Sep 28 '22 07:09

denis_lor