How to localize the images in Images.xcassets?

Question

We can localize an image in the File Inspector using Localize... like this:

Then we can get this:

But now, I use Images.xcassets to manage my images in my iOS project, how should I localize these images in Images.xcassets?

Bioplasm

Eh ? How do you localise an image exactly ? – Horologist

@Ohnomycoco Sorry for the unclear description of the question, I edited it. I localize an image as the description in the question. Actually, I have two images for "go_register": the English version would be stored in the en.lproj folder and the Chinese version would be stored in the zh-Hans.lproj folder after I localize them. But now, I use Images.xcassets to manage images, I don't konw how to do this. – Bioplasm

Can't do it. This would make a good feature request in the Apple bug reporter. – Sasnett

Answer 1

If you are using an Asset Catalog:

Asset catalog elements are now localizable. In the information panel for an asset, there is a "Localization" section that lists all the languages you've set up for your project in the project settings. If you don't select any of them, your images will be deemed "universal" (i.e., they will adopt the default behavior). If you select one or more of them, you will be able to select different images for "universal" and any alternate language.

For example, if your base language is English, and you want Spanish-language alternates, select only "Spanish" and drag in the alternate versions in the Spanish wells, and leave the English versions as the Universal. Then, at run-time, if the chosen language is Spanish, then the Spanish-language image will be pulled. Otherwise, it will pull the English version. (Or, if you want specific English and Spanish versions that are both different from "everything else", also check English and drag in the corresponding English and Universal images.)

If you need to determine localized images at run time without using the Asset Catalog:

While there's (apparently) not currently a way to explicitly localize the xcassets file directly, you could instead localize the name of the asset to pull using your Localizable.strings file. For instance, say you have a graphic logo treatment for the main menu of a game that needs to be localized. You could put the localized logo treatments in the assets file with different names, add the names to your Localizable.strings file, and then fetch the appropriate image with code like this:

UIImage *img = [UIImage imageNamed:NSLocalizedString(@"MAIN_MENU_IMAGE", nil)];

Trihedral

Don't know why Apple didn't think about that, but this solution is a really nice workaround indeed! – Wreckfish

For newbie's (like me) reference, if you don't know where to put the localization string, read description about NSLocalizedString for hint. You need to create a Localizable.strings yourself, and then localize it. Then you have the right localization files to list your image names for different languages. – Shortcut

The suggestion from @Shortcut works extremely well! Note that you don't really need to localize the image name. You can just abuse the localization system to produce keys, like "logo" = "logo-de" for the German version and "logo" = "logo-en" for English. – Lebrun

This is a wonderful suggestion. I'm going to use it for retrieving localized On-Demand Resources - using resource names specific to the supported locales. – Dichroism

Answer 2

That "Localize..." button is back in Xcode 11! So now you can localize your images and assets in the Asset catalog as you expect:

Anthraquinone

Answer 3

When Apple gives you lemons, make lemonade, or in this case, lemonade_en, lemonade_es or whatever suits your needs.

First, I create an entry for each desired language in my assets file like so:

Next, you will need to get a language code for the device. The important thing to remember here is that the user may have an unsupported language, so if that is the case, return your default (I use English).

The following extension of UIApplication will handle all of this for you:

extension UIApplication {
    var languageCode: String {
        let supportedLanguageCodes = ["en", "es", "fr"]
        let languageCode = Locale.current.languageCode ?? "en"

        return supportedLanguageCodes.contains(languageCode) ? languageCode : "en"
    }
}

This extension does the following:

• Creates an array of the languages my app supports
• Obtains the current device's language code, or returns a default value if this is nil
• Finally, it checks to see if the current code is in my supported list. If it is, it returns it, otherwise it returns my default code

Now, we combine the two to get the proper image:

let languageCode = UIApplication.shared.languageCode
let image = UIImage(named: "access_\(languageCode)")

Beethoven

Great, but would be better not to have supportedLanguageCodes hardcoded. – Endurant

Answer 4

After some search on the Internet, I think this feature is not provide by xcassets right now. Therefore, just don't use xcassets to manage your localization images.

Bibelot

Yes, you localize xcassets. Take a look to this post: https://mcmap.net/q/111910/-localize-asset-catalogs – Mabe

@JeanLebrument you probably didn't actually try it, because that method doesn't work at this moment of writing. – Siddon

by not using xcassets you compromise a great feature of app slicing – Highflier

Answer 5

I found another way:

1. add in you asset.xcassets a folder for each language (for instance: en,it,de)
2. set the flag "Provides Namespace" to each folder
3. copy all images and assets in that folder
4. In your code load the assets by calling

let languageCode = UIApplication.shared.languageCode
let image = UIImage(named: "\(languageCode)\assetname")

Anticathode

Works with iOS11 and up to iOS13. The new Xcode11 "way" does not work with iOS11. – Coppinger

Answer 6

At the moment, I pull out the images that needs localization from Images.xcassets and put it in the standard project folder. I leave the non-localized images in the .xcassets. I use your method for the images that need to be localized.

Ensepulcher