I've been getting some unexpected behavior when using TabView as the root view in SwiftUI, which I believe to be a bug. I created a barebones app to isolate the bug and will paste the code at the end for anyone who wants to try to reproduce it if you have a physical Duo device. Details below copied from my Feedback ticket FB25490881. Xcode 27.1.
What's the bug?
When you have a TabView as the root view inside the ContentView.swift and you open the app on the outer screen, then swipe it to the background, unfold the phone and tap the app to bring it to the foreground, any UI element without a fixed frame size gets moved off screen. And any UI element with a fixed frame size gets moved to the very top of the screen. See my two screenshots of outer vs inner display.
How to reproduce:
1- Unzip the project folder and open it in Xcode.
2- With a physical Duo on hand, run the app on the Duo.
3- On the outer screen, launch the app.
4- Swipe the app to the background (Do not swipe completely to close the app, just swipe it to the background so it is still running)
5- Unfold the iPhone Duo completely open.
6- Tap the app icon to bring it to the foreground.
7- Look at the broken UI.
Also note even the side tab bar itself is broken, it has no padding with the edge of the screen. This is managed by the system.
The workaround to fix it:
1- Go to the ContentView.Swift in Xcode.
2- Uncomment "NavigationStack {" on line 13.
3- Uncomment the closing bracket "}" on line 2.
4- Repeat the previous from how to reproduce the bug.
My hypothesis:
The system reports 0 height for the inner screen in that moment you bring the app to the foreground. Anything with a fixed frame will move to the top, anything with flexible height will not be visible. This only happens when TabView is the root of the scene.
Other Useful Information:
I hit a very similar bug to this in my main app that I'm still developing, unfortunately I was not able to reproduce it in a sandbox simple app. The bug was:
1- Open the app on outer screen
2- While the app is open, tilt the Duo to the back at a certain angle
3- Unfold the Duo
4- You get this exact same bug where everything with a flexible height disappears off screen or collapses to zero if it's in between UI elements with fixed heights. And everything moves to the top of the screen.
I'm not sure why I wasn't able to reproduce it on a sandbox app, but the fix was the same, either remove the TabView completely or put it inside a NavigationStack. I want to stress that this one had to do with the backwards tilt of the phone itself while unfolding it, very weird I know.
ContentView.swift:
import SwiftUI
@available(iOS 27.1, *)
struct ContentView: View {
var body: some View {
// NavigationStack {
TabView {
HomeTabView()
.tabItem { Label("Home", systemImage: "house") }
StoreView()
.tabItem { Label("Store", systemImage: "bag") }
}
.tint(Color.black)
// }
}
}
HomeTabView.swift:
import SwiftUI
@available(iOS 27.1, *)
struct HomeTabView: View {
var body: some View {
VStack {
Text("Jenny")
.font(.largeTitle)
.fontWeight(.bold)
.padding()
.frame(maxWidth: .infinity)
.frame(height: 200)
.background(Color.gray, in: .rect(cornerRadius: 28))
Spacer()
Circle()
.fill(Color.blue)
.frame(width: 100, height: 100)
.padding(.bottom, 50)
}
.contentMargins(for: .container, edges: .horizontal)
}
}
StoreView.swift is just an default empty swiftUI file with the default Text("Hello, World!")