I found that the zoom navigation transition with matchedTransitionSource in tabViewBottomAccessory does not work when the isPresented state is set through a published variable in an ObservableObject. So I get the same transition effect as if no matchedTransitionSource is set.
The iOS 17 Observable property wrapper has the same problem as with ObservableObject:
import SwiftUI
import Combine
private final class ViewModel: ObservableObject {
@Published var isPresented = false
}
struct ContentView: View {
@Namespace private var namespace
@StateObject private var viewModel = ViewModel()
// @State private var isPresented = false
var body: some View {
TabView {
Button {
viewModel.isPresented = true
} label: {
Text("Start")
}
.tabItem {
Image(systemName: "house")
Text("Home")
}
Text("Search")
.tabItem {
Image(systemName: "magnifyingglass")
Text("Search")
}
Text("Profile")
.tabItem {
Image(systemName: "person")
Text("Profile")
}
}
.sheet(isPresented: $viewModel.isPresented) {
Text("Sheet")
.presentationDragIndicator(.visible)
.navigationTransition(.zoom(sourceID: "tabViewBottomAccessoryTransition", in: namespace))
}
.tabViewBottomAccessory {
Button {
viewModel.isPresented = true
} label: {
Text("BottomAccessory")
}
.matchedTransitionSource(id: "tabViewBottomAccessoryTransition", in: namespace)
}
}
}
However, when using a State property everything works:
import SwiftUI
import Combine
private final class ViewModel: ObservableObject {
@Published var isPresented = false
}
struct ContentView: View {
@Namespace private var namespace
// @StateObject private var viewModel = ViewModel()
@State private var isPresented = false
var body: some View {
TabView {
Button {
isPresented = true
} label: {
Text("Start")
}
.tabItem {
Image(systemName: "house")
Text("Home")
}
Text("Search")
.tabItem {
Image(systemName: "magnifyingglass")
Text("Search")
}
Text("Profile")
.tabItem {
Image(systemName: "person")
Text("Profile")
}
}
.sheet(isPresented: $isPresented) {
Text("Sheet")
.presentationDragIndicator(.visible)
.navigationTransition(.zoom(sourceID: "tabViewBottomAccessoryTransition", in: namespace))
}
.tabViewBottomAccessory {
Button {
isPresented = true
} label: {
Text("BottomAccessory")
}
.matchedTransitionSource(id: "tabViewBottomAccessoryTransition", in: namespace)
}
}
}
Is there a reason why, am I doing something wrong with the navigation transitions or is it a SwiftUI bug?
Note:
- The snippets are minimal reproducible examples.
- This question is about navigation transitions in the
tabViewBottomAccessorywhich came with iOS 26.
This issue might just be a SwiftUI-Bug since thetabViewBottomAccessoryhad some other issues as seen here: Conditional TabViewBottomAccessory