Introduce concept of hidden views, ignore them when spacing stack children

This stops hidden views from affecting stack layouts and makes them act
closer to how you'd intuitively expect. For now the only hidden views
are OptionalViews with a nil wrapped view, and Groups with all children
hidden. The Group rule makes it so that Groups can be introduced without
affecting layouts, maximizing their usefulness.

Author: stackotter

Sources/SwiftCrossUI/LayoutSystem.swift

@@ -27,29 +27,50 @@ public enum LayoutSystem {
         }
     }
 
+    /// - Parameter inheritStackLayoutParticipation: If `true`, the stack layout
+    ///   will have ``ViewSize/participateInStackLayoutsWhenEmpty`` set to `true`
+    ///   if all of its children have it set to true. This allows views such as
+    ///   ``Group`` to avoid changing stack layout participation (since ``Group``
+    ///   is meant to appear completely invisible to the layout system).
     public static func updateStackLayout<Backend: AppBackend>(
         container: Backend.Widget,
         children: [LayoutableChild],
         proposedSize: SIMD2<Int>,
         environment: Environment,
         backend: Backend,
-        dryRun: Bool
+        dryRun: Bool,
+        inheritStackLayoutParticipation: Bool = false
     ) -> ViewSize {
         let spacing = environment.layoutSpacing
         let alignment = environment.layoutAlignment
         let orientation = environment.layoutOrientation
-        let totalSpacing = (children.count - 1) * spacing
-
-        var spaceUsedAlongStackAxis = 0
-        var childrenRemaining = children.count
 
         var renderedChildren = [ViewSize](
             repeating: .empty,
             count: children.count
         )
 
-        // My thanks go to this great article for investigating and explaining how SwiftUI determines
-        // child view 'flexibility': https://www.objc.io/blog/2020/11/10/hstacks-child-ordering/
+        // Figure out which views to treat as hidden. This could be the cause
+        // of issues if a view has some threshold at which it suddenly becomes
+        // invisible.
+        var isHidden = [Bool](repeating: false, count: children.count)
+        for (i, child) in children.enumerated() {
+            let size = child.computeSize(
+                proposedSize: proposedSize,
+                environment: environment
+            )
+            isHidden[i] =
+                size.size == .zero
+                && !size.participateInStackLayoutsWhenEmpty
+        }
+
+        // My thanks go to this great article for investigating and explaining
+        // how SwiftUI determines child view 'flexibility':
+        // https://www.objc.io/blog/2020/11/10/hstacks-child-ordering/
+        let visibleChildrenCount = isHidden.count { hidden in
+            !hidden
+        }
+        let totalSpacing = (visibleChildrenCount - 1) * spacing
         let proposedSizeWithoutSpacing = SIMD2(
             proposedSize.x - (orientation == .horizontal ? totalSpacing : 0),
             proposedSize.y - (orientation == .vertical ? totalSpacing : 0)
@@ -66,11 +87,40 @@ public enum LayoutSystem {
                     size.maximumHeight - Double(size.minimumHeight)
             }
         }
-        let sortedChildren = zip(children.enumerated(), flexibilities).sorted { first, second in
-            first.1 <= second.1
-        }.map(\.0)
+        let sortedChildren = zip(children.enumerated(), flexibilities)
+            .sorted { first, second in
+                first.1 <= second.1
+            }
+            .map(\.0)
 
+        var spaceUsedAlongStackAxis = 0
+        var childrenRemaining = visibleChildrenCount
         for (index, child) in sortedChildren {
+            // No need to render visible children.
+            if isHidden[index] {
+                // Update child in case it has just changed from visible to hidden,
+                // and to make sure that the view is still hidden (if it's not then
+                // it's a bug with either the view or the layout system).
+                let size = child.update(
+                    proposedSize: .zero,
+                    environment: environment,
+                    dryRun: dryRun
+                )
+                if size.size != .zero || size.participateInStackLayoutsWhenEmpty {
+                    print("warning: Hidden view became visible on second update. Layout may break.")
+                }
+                renderedChildren[index] = ViewSize(
+                    size: .zero,
+                    idealSize: .zero,
+                    minimumWidth: 0,
+                    minimumHeight: 0,
+                    maximumWidth: 0,
+                    maximumHeight: 0,
+                    participateInStackLayoutsWhenEmpty: false
+                )
+                continue
+            }
+
             let proposedWidth: Double
             let proposedHeight: Double
             switch orientation {
@@ -149,6 +199,13 @@ public enum LayoutSystem {
             var x = 0
             var y = 0
             for (index, childSize) in renderedChildren.enumerated() {
+                // Avoid the whole iteration if the child is hidden. If there
+                // are weird positioning issues for views that do strange things
+                // then this could be the cause.
+                if isHidden[index] {
+                    continue
+                }
+
                 // Compute alignment
                 switch (orientation, alignment) {
                     case (.vertical, .leading):
@@ -182,7 +239,10 @@ public enum LayoutSystem {
             minimumWidth: minimumWidth,
             minimumHeight: minimumHeight,
             maximumWidth: maximumWidth,
-            maximumHeight: maximumHeight
+            maximumHeight: maximumHeight,
+            participateInStackLayoutsWhenEmpty:
+                inheritStackLayoutParticipation
+                && isHidden.allSatisfy { $0 }
         )
     }
 }

Sources/SwiftCrossUI/ViewGraph/ViewSize.swift

@@ -16,6 +16,19 @@ public struct ViewSize: Equatable {
         maximumHeight: 0
     )
 
+    /// The view update result for a hidden view. Differs from ``ViewSize/empty``
+    /// by stopping hidden views from participating in stack layouts (i.e.
+    /// getting spacing between the previous child and the hidden child).
+    public static let hidden = ViewSize(
+        size: .zero,
+        idealSize: .zero,
+        minimumWidth: 0,
+        minimumHeight: 0,
+        maximumWidth: 0,
+        maximumHeight: 0,
+        participateInStackLayoutsWhenEmpty: false
+    )
+
     /// The size that the view now takes up.
     public var size: SIMD2<Int>
     /// The size that the view ideally wants to take up.
@@ -28,14 +41,29 @@ public struct ViewSize: Equatable {
     public var maximumWidth: Double
     /// The maximum height that the view can take (if its width remains the same).
     public var maximumHeight: Double
+    /// Whether the view should participate in stack layouts when empty.
+    ///
+    /// If `false`, the view won't get any spacing before or after it in stack
+    /// layouts. For example, this is used by ``OptionalView`` when its
+    /// underlying view is `nil` to avoid having spacing between views that are
+    /// semantically 'not present'.
+    ///
+    /// Only takes effect when ``ViewSize/size`` is zero, to avoid any ambiguity
+    /// when the view has non-zero size as this option is really only intended
+    /// to be used for visually hidden views (what would it mean for a non-empty
+    /// view to not participate in the layout? would the spacing between the
+    /// previous view and the next go before or after the view? would the view
+    /// get forced to zero size?).
+    public var participateInStackLayoutsWhenEmpty: Bool
 
     public init(
         size: SIMD2<Int>,
         idealSize: SIMD2<Int>,
         minimumWidth: Int,
         minimumHeight: Int,
         maximumWidth: Double?,
-        maximumHeight: Double?
+        maximumHeight: Double?,
+        participateInStackLayoutsWhenEmpty: Bool = true
     ) {
         self.size = size
         self.idealSize = idealSize
@@ -52,6 +80,8 @@ public struct ViewSize: Equatable {
         // I believe is a good compromise.
         self.maximumWidth = maximumWidth ?? Double(1 << 53)
         self.maximumHeight = maximumHeight ?? Double(1 << 53)
+        self.participateInStackLayoutsWhenEmpty =
+            participateInStackLayoutsWhenEmpty
     }
 
     public init(fixedSize: SIMD2<Int>) {
@@ -61,5 +91,6 @@ public struct ViewSize: Equatable {
         minimumHeight = fixedSize.y
         maximumWidth = Double(fixedSize.x)
         maximumHeight = Double(fixedSize.y)
+        participateInStackLayoutsWhenEmpty = true
     }
 }

Sources/SwiftCrossUI/Views/Group.swift

@@ -37,7 +37,8 @@ public struct Group<Content: View>: View {
             proposedSize: proposedSize,
             environment: environment,
             backend: backend,
-            dryRun: dryRun
+            dryRun: dryRun,
+            inheritStackLayoutParticipation: true
         )
         return size
     }

Sources/SwiftCrossUI/Views/OptionalView.swift

@@ -71,7 +71,7 @@ public struct OptionalView<V: View>: TypeSafeView, View {
         } else {
             hasToggled = children.node != nil
             children.node = nil
-            size = .empty
+            size = .hidden
         }
         children.hasToggled = children.hasToggled || hasToggled