Previewing a layout on different devices

SwiftUI allows us to preview designs on multiple screen sizes and device types simultaneously using the .previewDevice() modifier. In this recipe, we will create a simple app that displays an image and some text on multiple devices.

Getting ready

Let's create a SwiftUI app named PreviewOnDifferentDevices.

How to do it

We will add an image and some text to the ContentView struct and then modify the preview to show the content on multiple devices. The steps are as follows:

1. Click on the Preview Content folder in the Xcode navigation panel.
2. Import the friendship.jpg image from this chapter's resources file. Or download it at https://github.com/PacktPublishing/SwiftUI-Cookbook-2nd-Edition/blob/main/Resources/Chapter04/recipe4/friendship.jpg.
3. Open the ContentView.swift file and add the following code to display an image and some text:

   struct ContentView: View {
       var body: some View {
    ...