Preview your layout in different device configurations

Preview how a layout appears using different device configurations and localizations in the assistant editor. For iOS apps, preview the app using different devices and orientations. For iPad devices, preview the app using different split view sizes. For macOS apps, preview the app in light and dark mode.

Preview the layout in the current device configuration

  1. On the Interface Builder canvas or in the outline view, select the desired view controller.

  2. Choose View > Assistant Editor > Show Assistant Editor to open the assistant editor.

  3. In the assistant editor, open the editor pop-up menu by clicking on the first item in the jump bar.

  4. In the pop-up menu, choose Preview > [Filename] where [Filename] is the user interface file (for example, Main.storyboard).

Add a preview for a different device configuration

  1. In the assistant editor, click the plus (+) button in the lower left corner.

  2. From the pop-up menu, select a device or appearance.

    • For iOS and watchOS apps, choose a device.

      For iPad devices, the choices include split screen sizes such as one-third of an iPad screen.

    • For macOS apps, choose Light Appearance or Dark Appearance.

    • For tvOS apps, choose Light Style or Dark Style.

Switch the orientation of the preview (iOS)

Change the language of the preview

  1. In the assistant editor, select a preview or click in the background to deselect all previews.

    If no preview is selected, you will change the language of all previews.

  2. Click the language button—for example, English—on the lower right.

  3. In the pop-up menu that appears, choose a language.

    If you haven’t localized your app yet (added languages), you can choose the development language or one of the pseudolanguage options:

    • Double-Length Pseudolanguage: Replaces all user-facing strings with duplicate strings.

    • Accented Pseudolanguage: Uses accented text in the pseudolanguage.

    • Bounded String Pseudolanguage: Uses bounded strings—strings with maximum length—in the pseudolanguage.