Greetings!
I'm facing a problem handleling full keyboard access in my app.
This is a simpler version of the code:
struct PrimerTest: View {
@FocusState private var focusedImage: Int?
var body: some View {
VStack(alignment: .leading, spacing: 20) {
Link("Go to google or smth", destination: URL(string: "https://google.com")!)
.font(.headline)
Text("First text")
Text("Second text")
HStack {
Text("Label")
.accessibilityHidden(true)
Spacer()
Button("Play") {
print("Im a button")
}
}
Text("Selecciona un perfil con el teclado (Tab):")
.font(.caption)
.foregroundColor(.secondary)
HStack {
ForEach(0..<5, id: \.self) { index in
Image(systemName: "person.circle.fill")
.resizable()
.frame(width: 30, height: 30)
.focusable(true)
.focused($focusedImage, equals: index)
.foregroundStyle(focusedImage == index ? Color.blue : Color.gray)
.scaleEffect(focusedImage == index ? 1.2 : 1.0)
.animation(.easeInOut, value: focusedImage)
.accessibilityHidden(true)
}
}
}
.navigationTitle("Title n stuff")
.padding()
}
}
And the focus behaves as expected and the important thing, we can access que button on the right side of the screen
But as soon as we introduce the scrollview, the right side button is unaccessible, since when we hit tab we go back to the back button in the nav stack header.
struct PrimerTest: View {
@FocusState private var focusedImage: Int?
var body: some View {
ScrollView {
VStack(alignment: .leading, spacing: 20) {
Link("Go to google or smth", destination: URL(string: "https://google.com")!)
.font(.headline)
Text("First text")
Text("Second text")
HStack {
Text("Label")
.accessibilityHidden(true)
Spacer()
Button("Play") {
print("Im a button")
}
}
Text("Selecciona un perfil con el teclado (Tab):")
.font(.caption)
.foregroundColor(.secondary)
HStack {
ForEach(0..<5, id: \.self) { index in
Image(systemName: "person.circle.fill")
.resizable()
.frame(width: 30, height: 30)
.focusable(true)
.focused($focusedImage, equals: index)
.foregroundStyle(focusedImage == index ? Color.blue : Color.gray)
.scaleEffect(focusedImage == index ? 1.2 : 1.0)
.animation(.easeInOut, value: focusedImage)
.accessibilityHidden(true)
}
}
}
}
.navigationTitle("Title n stuff")
.padding()
}
}
I've tried all the things I found online and none achieves an acceptable behavoir, I've seen ppl saying this issue has been fixed in ipados with the focusSection modifier, but I have not seen any fix fot this issue in ios.
