Localize Image Assets in Xcode

Learn how to use Xcode’s graphical interface to manage localized image assets

Jianyuan Chen
Nerd For Tech
3 min readMay 25, 2021

--

Localizing image assets interface
Localizing image assets interface

Xcode’s graphical interface provides a convenient and powerful way to manage image assets and you should already be familiar with how it is used if you’ve ever included images in your app.

Turns out, it not only lets you manage image assets but also allows you to localize your image assets by providing different images for different locales. All you need to do is define for which locales the assets should be used, and provide the correct localized image for each locale.

This is done for each image asset so that you can choose to localize only those worth localizing.

The same localization effect can be achieved programmatically by adding the localized images as an entirely separate image set. For example, naming the images ending in locale names image_en and image_zh_CN, then check explicitly in code the current locale with Locale.current, extract the locale identifier, and return the image accordingly.

This approach requires an extensive setup and you have to follow a very specific pattern for naming your images. Not only that, you will end up with a long list of image assets and it is difficult to maintain. If you an image is no longer needed, you have to remember to remove its localized counterparts.

The Correct Way

Now I will walk you through the steps to achieve this with Xcode’s graphical interface. Let’s start with a typical image asset.

  1. Start by adding an image set
Assets supporting one locale
Assets supporting one locale

There’s currently only one set of assets. The same image will be used regardless of the locale.

2. Focus on the image asset and find the localization option down in the right inspector panel. This is where you specify the locales to be supported.

Find the localization option in the inspector panel
Find the localization option in the inspector panel

Click the locales you want to support. As you make selections, the UI for the image assets will change accordingly.

Pick the locale to localize
Pick the locale to localize

The empty assets pointed by red arrows are created by Xcode.

3. Fill in the images with appropriate the localized version

Pick the locale to localize
Pick the locale to localize

--

--