SafePreviewDevice
  • August 1, 2025

Motivation


At WWDC 2019, Apple announced SwiftUI a new library for building UI in a simple and fast way.
Xcode’s SwiftUI preview lets us show our application design in multiple screen sizes at the same time using the .previewDevice() modifier. Currently, this needs to be provided with the exact name of the device you want to test: e.g. “iPhone XS Max”.

.previewDevice(PreviewDevice(rawValue: “iPhone XS Max”))

or even better

.previewDevice(.iPhone7)

This framework comes to rescue for everyone that is looking for an easy way to select their preview device or they just don’t remember every iOS 13 device name (like me 😀)

System Requirements


Supported platforms are iOS (13.0)tvOS (13.0)watchOS (6.0) and macOS (10.15) and of course Xcode 11.

Installation


SafePreviewDevice can be installed via Swift Package Manager.

Swift Package Manager

To integrate using Apple’s Swift package manager, add the following as a dependency to your Package.swift

.package(url: “https://github.com/posix88/SafePreviewDevice.git”, .upToNextMajor(from: “0.1.0”))

and run swift package update.

Otherwise, you can simply go to File -> Swift Packages -> Add Package Dependency and paste the repo’s URL: https://github.com/posix88/SafePreviewDevice

CocoaPods

Add the following entry to your Podfile:

pod ‘SafePreviewDevice’

Then run pod install.

Usage


Simply import this framework in your SwiftUI file and add one of this View modifier to your preview:

Display a preview device

.previewDevice(.iPhone7)

his modifier will change the displayed device in the Xcode SwiftUI preview.

Change the preview device name

.previewDeviceName(.iPhone7)

This modifier will change the displayed device name in the Xcode SwiftUI preview.

What’s new 🚀


Display a named preview device

.previewNamedDevice(.iPhone7)

This modifier is the union between the first APIs. It will change the displayed device in the Xcode SwiftUI preview setting also the device name.

Display a preview device applying the color scheme

.previewDevice(.iPhone7, withColorScheme: .dark)

This modifier will change the displayed device in the Xcode SwiftUI preview. It also applies the selected color scheme.

Display a named preview device applying the color scheme

.previewNamedDevice(.iPhone7, withColorScheme: .dark)

This modifier will change the displayed named device in the Xcode SwiftUI preview. It also applies the selected color scheme.

Display a group of named preview device applying a list of color scheme

.previewDevices([.iPhone7, .iPhoneSE, .iPhoneX], withColorScheme: [.dark, .light])

This modifier provides an inline alternative to

Group {
MyView().previewDevice(.iPhone7, withColorScheme: .dark)
MyView().previewDevice(.iPhone7, withColorScheme: .light)
MyView().previewDevice(.iPhoneSE, withColorScheme: .dark)
MyView().previewDevice(.iPhoneSE, withColorScheme: .light)
MyView().previewDevice(.iPhoneX, withColorScheme: .dark)
MyView().previewDevice(.iPhoneX, withColorScheme: .light)
}

GitHub


View Github

YOU MIGHT ALSO LIKE...
FigmaPreviewSwiftUI

A Figma component preview for your SwiftUI views. You can use Figma components instead of real views within your app ...

PreviewView

Make use of SwiftUI previews for rapidly prototyping your UIViewControllers and UIViews! The SwiftUI preview canvas is tied to a specific version of ...

PreviewDevice

Requirements   Dev environment: Xcode 13+, macOS 12+ iOS 13.0+, macOS 10.15+, Mac Catalyst 13.0+, tvOS 13.0+, watchOS 6.0+ Usage

SwiftUIWheelPicker

Horizontal wheel picker for SwiftUI Requirements iOS 13.0+ Installation CocoaPods

PermissionsSwiftUI: A SwiftUI package to handle permissions

PermissionsSwiftUI displays and handles permissions in SwiftUI. It is largely inspired by SPPermissions. The UI is highly customizable and resembles an Apple style. ...