How to: Build A Cross-Platform App with SwiftUI 2

Let me show you how to build a simple app that works on iOS, iPadOS, and macOS…

Image: developer.apple.com

How to know the device is running iOS / macOS?

We can use:

#if os(iOS) //For iPhone/iPad
#elseif os(macOS) //For Mac
#elseif os(watchOS) //For WatchOS
#endif
WWDC20

If you want to divide iPhone and iPad design, before

var body: some View

add the following code,

@Environment(\.horizontalSizeClass)
private var horizontalSizeClass

and then add,

if horizontalSizeClass == .compact //For iPhone

after

var body: some View

Example:

import SwiftUIstruct ContentView: View {
#if os(iOS)
@Environment(\.horizontalSizeClass)
private var horizontalSizeClass
#endif
var body: some View {
#if os(iOS)
if horizontalSizeClass == .compact //For iPhone
{
Text(“Hello! iPhone.”)
}
else //For iPad
{
Text(“Hello! iPad.”)
}
#else //For Mac
Text(“Hello! Mac.”)
#endif}
}

How to Build A Native Toggle Sidebar to SwiftUI?

How to Build A Native Widget for iOS 14 with SwiftUI?

How to Upload iOS14 App Widget to TestFlight?

👏 That’s all. Congrats!

Developer, UI/UX Designer and 📽Photographer | Contact: hello@1998.media | Website: 1998.media

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store