The only way I found to make the accessibility focus work correctly in the detent in a fullscreen cover is to apply the focus manually. The issue is in the ContentView the grabber works while in the fullscreen it does not. Is there something I am missing or is this a bug. I also don't understand why I need to apply focus in the fullscreen cover while in the ContentView I do not.
struct ContentView: View {
@State private var buttonClicked = false
@State private var bottomSheetShowing = false
var body: some View {
NavigationView {
VStack {
Button(action: {
buttonClicked = true
}, label: {
Text("First Page Button")
.padding()
.background(Color.blue)
.foregroundColor(.white)
.cornerRadius(8)
})
.accessibilityLabel("First Page Button")
FullscreenView2()
}
.navigationTitle("Welcome")
.fullScreenCover(isPresented: $buttonClicked) {
FullscreenView(buttonClicked: $buttonClicked, bottomSheetShowing: $bottomSheetShowing)
}
}
}
}
struct FullscreenView: View {
@Binding var buttonClicked: Bool
@Binding var bottomSheetShowing: Bool
var body: some View {
NavigationView {
VStack {
Button(action: {
bottomSheetShowing = true
}, label: {
Text("Show Bottom Sheet")
.padding()
.background(Color.green)
.foregroundColor(.white)
.cornerRadius(8)
})
}
.accessibilityHidden(bottomSheetShowing)
.navigationTitle("Fullscreen View")
.toolbar {
ToolbarItem(placement: .navigationBarLeading) {
Button(action: {
buttonClicked = false
}, label: {
Text("Close")
})
.accessibilityLabel("Close Fullscreen View Button")
}
}
.accessibilityHidden(bottomSheetShowing)
.onChange(of: bottomSheetShowing, perform: { _ in })
.sheet(isPresented: $bottomSheetShowing) {
if #available(iOS 16.0, *) {
BottomSheetView(bottomSheetShowing: $bottomSheetShowing)
.presentationDetents([.medium, .large])
} else {
BottomSheetView(bottomSheetShowing: $bottomSheetShowing)
}
}
}
}
}
struct FullscreenView2: View {
@State var bottomSheetShowing = false
var body: some View {
VStack {
Button(action: {
bottomSheetShowing = true
}, label: {
Text("Show Bottom Sheet")
.padding()
.background(Color.green)
.foregroundColor(.white)
.cornerRadius(8)
})
}
.accessibilityHidden(bottomSheetShowing)
.navigationTitle("Fullscreen View")
//.accessibilityHidden(bottomSheetShowing)
.onChange(of: bottomSheetShowing, perform: { _ in })
.sheet(isPresented: $bottomSheetShowing) {
if #available(iOS 16.0, *) {
BottomSheetView(bottomSheetShowing: $bottomSheetShowing)
.presentationDetents([.medium, .large])
} else {
BottomSheetView(bottomSheetShowing: $bottomSheetShowing)
}
}
}
}
struct BottomSheetView: View {
@Binding var bottomSheetShowing: Bool
// @AccessibilityFocusState var isFocused: Bool
var body: some View {
VStack(spacing: 20) {
Text("Bottom Sheet")
.font(.headline)
.accessibilityAddTraits(.isHeader)
Button(action: {
bottomSheetShowing = false
}, label: {
Text("Dismiss")
.padding()
.background(Color.red)
.foregroundColor(.white)
.cornerRadius(8)
})
.accessibilityLabel("Dismiss Bottom Sheet Button")
}
.padding()
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(
Color(UIColor.systemBackground)
.edgesIgnoringSafeArea(.all)
)
.accessibilityAddTraits(.isModal) // Indicates that this view is a modal
// .onAppear {
// // Set initial accessibility focus when the sheet appears
// DispatchQueue.main.asyncAfter(deadline: .now() + 1.0) {
// isFocused = true
// }
// }
// .accessibilityFocused($isFocused)
}
}
Topic:
Accessibility & Inclusion
SubTopic:
General