Skip to content

When the tab view transitions in, the content appears off-center and the animation goes back and forth before it stabilizes.

Notifications You must be signed in to change notification settings

clns/TabViewTransitionBug

Repository files navigation

SwiftUI TabView Bug

This repository demonstrates a SwiftUI TabView bug when used with .tabViewStyle(.page) and any animated .transition() that moves the view horizontally (e.g. .move(edge: .leading/.trailing)), .slide, .offset(), etc.) in landscape orientation.

When the tab view transitions in, the content appears off-center and the animation goes back and forth before it stabilizes.

The code to replicate this:

import SwiftUI

struct ContentView: View {
    @State private var showTabView = false
    var body: some View {
        VStack {
            Button("Toggle TabView") {
                showTabView.toggle()
            }
            Spacer()
            if showTabView {
                TabView {
                    Text("Page One")
                    Text("Page Two")
                }
                .tabViewStyle(.page)
                .transition(.slide)
            }
        }
        .animation(.default, value: showTabView)
    }
}

#Preview {
    ContentView()
}

@main
struct TabViewTransitionBugApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

Tested on Xcode 15.3 (15E204a), iOS 17.3.1 iPhone, iOS 17.4 Simulator.

About

When the tab view transitions in, the content appears off-center and the animation goes back and forth before it stabilizes.

Topics

Resources

Stars

Watchers

Forks

Languages