VoiceOver Support (#35)

* Animations and FlowStack working with infinite layers with voice control

* Stopped tracking xcschemes directory

* added observer so that FlowStack knows when to switch the flowView's ZIndex

* introduced a AccessibilityModifier to hold everything there

Author: brody2002

FlowStackExample/FlowStackExample.xcodeproj/project.pbxproj

@@ -309,7 +309,7 @@
 				CODE_SIGN_STYLE = Automatic;
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_ASSET_PATHS = "\"FlowStackExample/Preview Content\"";
-				DEVELOPMENT_TEAM = CBXAQN69JX;
+				DEVELOPMENT_TEAM = DAPFLRCVJA;
 				ENABLE_PREVIEWS = YES;
 				GENERATE_INFOPLIST_FILE = YES;
 				INFOPLIST_KEY_UIApplicationSceneManifest_Generation = YES;
@@ -342,7 +342,7 @@
 				CODE_SIGN_STYLE = Automatic;
 				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_ASSET_PATHS = "\"FlowStackExample/Preview Content\"";
-				DEVELOPMENT_TEAM = CBXAQN69JX;
+				DEVELOPMENT_TEAM = DAPFLRCVJA;
 				ENABLE_PREVIEWS = YES;
 				GENERATE_INFOPLIST_FILE = YES;
 				INFOPLIST_KEY_UIApplicationSceneManifest_Generation = YES;

Sources/FlowStack/FlowLink.swift

@@ -56,6 +56,17 @@ public extension View {
     }
 }
 
+struct FlowDepthKey: EnvironmentKey {
+    static var defaultValue: Int = 0
+}
+
+extension EnvironmentValues {
+    var flowDepth: Int {
+        get { self[FlowDepthKey.self] }
+        set { self[FlowDepthKey.self] = newValue }
+    }
+}
+
 struct GestureContainer: UIViewRepresentable {
 
     @Binding var isPressed: Bool
@@ -238,8 +249,8 @@ public struct FlowLink<Label>: View where Label: View {
     @Environment(\.self) private var capturedEnvironment
 
     @Environment(\.flowPath) private var path
+    @Environment(\.flowDepth) private var flowDepth
     @Environment(\.flowTransaction) private var transaction
-    @EnvironmentObject var flowDepth: FlowDepth
 
     @State private var overrideAnchor: Anchor<CGRect>?
 
@@ -270,16 +281,16 @@ public struct FlowLink<Label>: View where Label: View {
     }
 
     var isContainedInPath: Bool {
-        guard let elements = path?.wrappedValue.elements, let value = value, elements.count > Int(flowDepth.zIndex) else { return false }
+        guard let elements = path?.wrappedValue.elements, let value = value, elements.count > flowDepth else { return false }
 
         // treat -1 as special case to ignore the level on comparisons
-        let depth = flowDepth.zIndex == -1 ? nil : flowDepth.zIndex
+        let depth = flowDepth == -1 ? nil : flowDepth
 
-        return path?.wrappedValue.contains(value, atLevel: Int(flowDepth.zIndex)) ?? false
+        return path?.wrappedValue.contains(value, atLevel: depth) ?? false
     }
 
     var hasSiblingElement: Bool {
-        return path?.wrappedValue.elements.map(\.context?.linkDepth).contains(Int(flowDepth.zIndex)) ?? false
+        return path?.wrappedValue.elements.map(\.context?.linkDepth).contains(flowDepth) ?? false
     }
 
     @State private var snapshot: UIImage?
@@ -401,7 +412,7 @@ public struct FlowLink<Label>: View where Label: View {
                 anchor: configuration.animateFromAnchor ? anchor : nil,
                 overrideAnchor: configuration.animateFromAnchor ? overrideAnchor : nil,
                 snapshot: configuration.animateFromAnchor && configuration.transitionFromSnapshot ? snapshot : nil,
-                linkDepth: Int(flowDepth.zIndex),
+                linkDepth: flowDepth,
                 cornerRadius: configuration.cornerRadius,
                 cornerStyle: configuration.cornerStyle,
                 shadowRadius: configuration.shadowRadius,

Sources/FlowStack/FlowStack.swift

@@ -4,6 +4,7 @@
 //  Created by Zac White on 2/14/23.
 //
 
+import Combine
 import SwiftUI
 
 struct AnyDestination: Equatable {
@@ -24,20 +25,55 @@ class DestinationLookup: ObservableObject {
     @Published var table: [String: AnyDestination] = [:]
 }
 
-// Tracks Z index for accessibility
-class FlowDepth: ObservableObject {
+class AccessibilityManager: ObservableObject {
     @Published var zIndex: Double = 0.0
+    var skrimIndex: Double { zIndex - 0.1 }
+    var behindSkrim: Double { zIndex - 0.2 }
+
+    // Setup VoiceOver Observer
+    @Published var isVoiceOverRunning: Bool = UIAccessibility.isVoiceOverRunning
+    init() {
+        NotificationCenter.default
+            .publisher(for: UIAccessibility.voiceOverStatusDidChangeNotification)
+            .map { _ in UIAccessibility.isVoiceOverRunning }
+            .assign(to: &$isVoiceOverRunning)
+    }
+
+    func setIndex(_ input: Int) { self.zIndex = Double(input + 1)}
+
+    func decrementIndex() { self.zIndex -= 1.0 }
+
+    func calcSkrim() -> Double {
+        if isVoiceOverRunning { return skrimIndex }
+        return zIndex > 1.0 ? zIndex : skrimIndex
+    }
+}
+
+struct AccessibilityModifier: ViewModifier {
+    @EnvironmentObject var accessibilityManager: AccessibilityManager
+    var isHidden: (Double, Int) -> Bool = { d, i in d != Double(i + 1) }
+    let element: Int
+
+    func body(content: Content) -> some View {
+        content
+            .environment(\.flowDepth, element + 1)
+            .zIndex(Double(accessibilityManager.zIndex))
+            .accessibilityElement(children: .contain)
+            .accessibilityHidden(isHidden(accessibilityManager.zIndex, element))
+            .onAppear { accessibilityManager.setIndex(element) }
+    }
 }
 
 struct FlowDestinationModifier<D: Hashable>: ViewModifier {
     @State var dataType: D.Type
     @State var destination: AnyDestination
     @EnvironmentObject var destinationLookup: DestinationLookup
-    @EnvironmentObject var flowDepth: FlowDepth
+    @EnvironmentObject var accessibilityManager: AccessibilityManager
+    @Environment(\.flowDismiss) var flowDismiss
 
     func body(content: Content) -> some View {
         content
-            .zIndex(flowDepth.zIndex)
+            .zIndex(accessibilityManager.isVoiceOverRunning ? accessibilityManager.zIndex : accessibilityManager.behindSkrim)
             // swiftlint:disable:next force_unwrapping
             .onAppear { destinationLookup.table.merge([_mangledTypeName(dataType)!: destination], uniquingKeysWith: { _, rhs in rhs }) }
     }
@@ -91,14 +127,12 @@ public extension View {
             guard let param = AnyDestination.cast(data: param, to: type) else {
                 fatalError()
             }
-
             return AnyView (
                 destination(param)
                     .accessibilityElement(children: .contain)
                     .accessibilityRespondsToUserInteraction(true)
             )
         })
-
         return modifier(FlowDestinationModifier(dataType: type, destination: destination))
     }
 }
@@ -186,7 +220,7 @@ public struct FlowStack<Root: View, Overlay: View>: View {
     private var usesInternalPath: Bool = false
 
     @State private var destinationLookup: DestinationLookup = .init()
-    @StateObject var flowDepth: FlowDepth = .init()
+    @StateObject var accessibilityManager: AccessibilityManager = .init()
 
     /// Creates a flow stack that manages its own navigation state.
     /// - Parameters:
@@ -231,14 +265,14 @@ public struct FlowStack<Root: View, Overlay: View>: View {
     private func skrim(for element: FlowElement) -> some View {
         if element == pathToUse.wrappedValue.elements.last, element.context?.shouldShowSkrim == true {
             Rectangle()
-               .foregroundColor(Color.black.opacity(0.7))
-               .transition(.opacity)
-               .ignoresSafeArea()
-               .zIndex(flowDepth.zIndex - 0.1)
-               .id(element.hashValue)
-               .onTapGesture {
-                   flowDismissAction()
-               }
+                .foregroundColor(Color.black.opacity(0.7))
+                .transition(.opacity)
+                .ignoresSafeArea()
+                .zIndex(accessibilityManager.calcSkrim())
+                .id(element.hashValue)
+                .onTapGesture {
+                    flowDismissAction()
+                }
         }
     }
 
@@ -250,9 +284,9 @@ public struct FlowStack<Root: View, Overlay: View>: View {
         FlowDismissAction(
             onDismiss: {
                 withTransaction(transaction) {
+                    accessibilityManager.decrementIndex()
                     pathToUse.wrappedValue.removeLast()
                 }
-                flowDepth.zIndex -= 1
             })
     }
 
@@ -267,35 +301,32 @@ public struct FlowStack<Root: View, Overlay: View>: View {
             root()
                 .contentShape(Rectangle())
                 .accessibilityElement(children: .contain)
-                .accessibilityHidden(flowDepth.zIndex != 0)
-
+                .accessibilityHidden(accessibilityManager.zIndex != 0)
+                .environment(\.flowDepth, 0)
 
             ForEach(pathToUse.wrappedValue.elements, id: \.self) { element in
                 if let destination = destination(for: element.value) {
 
                     skrim(for: element)
+
                     destination.content(element.value)
                         .contentShape(Rectangle())
                         .frame(maxWidth: .infinity, maxHeight: .infinity)
                         .id(element.hashValue)
                         .transition(.flowTransition(with: element.context ?? .init()))
-                        .zIndex(flowDepth.zIndex)
-                        .accessibilityElement(children: .contain)
-                        .accessibilityHidden(flowDepth.zIndex != Double(element.index + 1))
-                        .onAppear { flowDepth.zIndex = Double(element.index + 1) }
+                        .modifier(AccessibilityModifier(element: element.index))
                 }
             }
         }
-        .zIndex(flowDepth.zIndex)
         .accessibilityElement(children: .contain)
         .overlay(alignment: overlayAlignment) {
             overlay()
-                .zIndex(flowDepth.zIndex - 1.0)
+                .environment(\.flowDepth, -1)
         }
         .environment(\.flowPath, pathToUse)
         .environment(\.flowTransaction, transaction)
         .environmentObject(destinationLookup)
-        .environmentObject(flowDepth)
+        .environmentObject(accessibilityManager)
         .environment(\.flowDismiss, flowDismissAction)
     }
 }