Overview
- On the iPad Portrait mode using
@SceneStorage
doesn’t show the detail screen, instead it shows the place holder screen. - Tapping on the back button then shows the restored detail screen
Problem
@SceneStorage
successfully restores the value, however the problem is about the navigation stack after the value is restored.
Steps to Reproduce
- Run on iPad potrait
- Select the Car "bbb"
- See the Car Detail with the car name "bbb"
- Enter background
- Repeat steps 1 and 2
Actual Behaviour:
Notice the car name is not displayed, it shows the "No car selected" text, tapping on the back button then shows the CarDetail screen with the name "bbb"
Expected Behaviour:
The shows the CarDetail screen should show with the name "bbb" immediately instead of showing the place holder screen
Note:
- It works fine on iPhone potrait and iPad landscape
- Problem is on iPad potrait and iPhone 13 Pro max landscape
GIF
Configuration
- iPad OS 15.5
- Xcode 13.4 (13F17a)
- macOS 12.4 (21F79)
Code:
ContentView
struct ContentView: View {
var body: some View {
NavigationView {
CarList()
Text("No car selected")
.font(.largeTitle)
}
}
}
CarList
struct CarList: View {
let cars = [Car(id: 1, name: "aaa"),
Car(id: 2, name: "bbb"),
Car(id: 3, name: "ccc")]
@SceneStorage("selectedCarID") private var selectedCarID: Int?
var body: some View {
List {
ForEach(cars) { car in
NavigationLink(tag: car.id, selection: $selectedCarID) {
CarDetail(name: car.name)
} label: {
Text(car.name)
}
}
}
}
}
CarDetail
struct CarDetail: View {
let name: String
var body: some View {
ZStack {
Color.brown
Text(name)
.font(.largeTitle)
}
}
}
Car
struct Car: Identifiable {
var id: Int
var name: String
}
2
Answers
The official docs on SceneStorage –
I reproduced as you mentioned in the steps and saw the same behaviour.
Also if you noticed switching the emulator back to portrait in iPhone 13 pro max and landscape in iPad Pro (12.9-inch) poof MAGIC the Car detail screens comes back automatically.
So, I guess it’s a bug on apple’s side where SceneStorage is not working in certain orientation of some devices. Should let them know to fix it.
Hope it helps.
I faced such issue on iPhone 13 pro max in landscape position, it uses iPad behavior. Add .navigationViewStyle(.stack) for NavigationView for change behaviour.
NavigationView {
//content
}
.navigationViewStyle(.stack)