Split View.update into View.computeLayout and View.commit

Author: stackotter

Examples/Sources/WindowingExample/WindowingApp.swift

@@ -84,6 +84,8 @@ struct WindowingApp: App {
                     }
 
                     Image(Bundle.module.bundleURL.appendingPathComponent("Banner.png"))
+                        .resizable()
+                        .aspectRatio(contentMode: .fit)
 
                     Divider()
 

Sources/AppKitBackend/AppKitBackend.swift

@@ -29,12 +29,14 @@ public final class AppKitBackend: AppBackend {
         // We assume that all scrollers have their controlSize set to `.regular` by default.
         // The internet seems to indicate that this is true regardless of any system wide
         // preferences etc.
-        Int(
+        let result = Int(
             NSScroller.scrollerWidth(
                 for: .regular,
                 scrollerStyle: NSScroller.preferredScrollerStyle
             ).rounded(.awayFromZero)
         )
+        print(result)
+        return result
     }
 
     private let appDelegate = NSCustomApplicationDelegate()

Sources/AppKitBackend/NSViewRepresentable.swift

@@ -139,15 +139,14 @@ extension View where Self: NSViewRepresentable {
         }
     }
 
-    public func update<Backend: AppBackend>(
+    public func computeLayout<Backend: AppBackend>(
         _ widget: Backend.Widget,
         children: any ViewGraphNodeChildren,
         proposedSize: SIMD2<Int>,
         environment: EnvironmentValues,
-        backend: Backend,
-        dryRun: Bool
-    ) -> ViewUpdateResult {
-        guard let backend = backend as? AppKitBackend else {
+        backend: Backend
+    ) -> ViewLayoutResult {
+        guard backend is AppKitBackend else {
             fatalError("NSViewRepresentable updated by \(Backend.self)")
         }
 
@@ -160,11 +159,17 @@ extension View where Self: NSViewRepresentable {
             context: representingWidget.context!
         )
 
-        if !dryRun {
-            backend.setSize(of: representingWidget, to: size.size)
-        }
+        return ViewLayoutResult.leafView(size: size)
+    }
 
-        return ViewUpdateResult.leafView(size: size)
+    public func commit<Backend: AppBackend>(
+        _ widget: Backend.Widget,
+        children: any ViewGraphNodeChildren,
+        layout: ViewLayoutResult,
+        environment: EnvironmentValues,
+        backend: Backend
+    ) {
+        backend.setSize(of: widget, to: layout.size.size)
     }
 }
 

Sources/SwiftCrossUI/Layout/LayoutSystem.swift

@@ -45,28 +45,34 @@ public enum LayoutSystem {
     }
 
     public struct LayoutableChild {
-        private var update:
+        private var computeLayout:
             (
                 _ proposedSize: SIMD2<Int>,
-                _ environment: EnvironmentValues,
-                _ dryRun: Bool
-            ) -> ViewUpdateResult
+                _ environment: EnvironmentValues
+            ) -> ViewLayoutResult
+        private var _commit: () -> ViewLayoutResult
         var tag: String?
 
         public init(
-            update: @escaping (SIMD2<Int>, EnvironmentValues, Bool) -> ViewUpdateResult,
+            computeLayout: @escaping (SIMD2<Int>, EnvironmentValues) -> ViewLayoutResult,
+            commit: @escaping () -> ViewLayoutResult,
             tag: String? = nil
         ) {
-            self.update = update
+            self.computeLayout = computeLayout
+            self._commit = commit
             self.tag = tag
         }
 
-        public func update(
+        public func computeLayout(
             proposedSize: SIMD2<Int>,
             environment: EnvironmentValues,
             dryRun: Bool = false
-        ) -> ViewUpdateResult {
-            update(proposedSize, environment, dryRun)
+        ) -> ViewLayoutResult {
+            computeLayout(proposedSize, environment)
+        }
+
+        public func commit() -> ViewLayoutResult {
+            _commit()
         }
     }
 
@@ -75,61 +81,43 @@ public enum LayoutSystem {
     ///   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>(
+    public static func computeStackLayout<Backend: AppBackend>(
         container: Backend.Widget,
         children: [LayoutableChild],
         proposedSize: SIMD2<Int>,
         environment: EnvironmentValues,
         backend: Backend,
-        dryRun: Bool,
         inheritStackLayoutParticipation: Bool = false
-    ) -> ViewUpdateResult {
+    ) -> ViewLayoutResult {
         let spacing = environment.layoutSpacing
-        let alignment = environment.layoutAlignment
         let orientation = environment.layoutOrientation
 
-        var renderedChildren: [ViewUpdateResult] = Array(
-            repeating: ViewUpdateResult.leafView(size: .empty),
+        var renderedChildren: [ViewLayoutResult] = Array(
+            repeating: ViewLayoutResult.leafView(size: .empty),
             count: children.count
         )
 
-        // 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.
+        // 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/
         var isHidden = [Bool](repeating: false, count: children.count)
-        for (i, child) in children.enumerated() {
-            let result = child.update(
+        let flexibilities = children.enumerated().map { i, child in
+            let result = child.computeLayout(
                 proposedSize: proposedSize,
-                environment: environment,
-                dryRun: true
+                environment: environment
             )
             isHidden[i] = !result.participatesInStackLayouts
-        }
-
-        // 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.filter { hidden in
-            !hidden
-        }.count
-        let totalSpacing = max(visibleChildrenCount - 1, 0) * spacing
-        let proposedSizeWithoutSpacing = SIMD2(
-            proposedSize.x - (orientation == .horizontal ? totalSpacing : 0),
-            proposedSize.y - (orientation == .vertical ? totalSpacing : 0)
-        )
-        let flexibilities = children.map { child in
-            let size = child.update(
-                proposedSize: proposedSizeWithoutSpacing,
-                environment: environment,
-                dryRun: true
-            ).size
             return switch orientation {
                 case .horizontal:
-                    size.maximumWidth - Double(size.minimumWidth)
+                    result.size.maximumWidth - Double(result.size.minimumWidth)
                 case .vertical:
-                    size.maximumHeight - Double(size.minimumHeight)
+                    result.size.maximumHeight - Double(result.size.minimumHeight)
             }
         }
+        let visibleChildrenCount = isHidden.filter { hidden in
+            !hidden
+        }.count
+        let totalSpacing = max(visibleChildrenCount - 1, 0) * spacing
         let sortedChildren = zip(children.enumerated(), flexibilities)
             .sorted { first, second in
                 first.1 <= second.1
@@ -144,10 +132,9 @@ public enum LayoutSystem {
                 // 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 result = child.update(
+                let result = child.computeLayout(
                     proposedSize: .zero,
-                    environment: environment,
-                    dryRun: dryRun
+                    environment: environment
                 )
                 if result.participatesInStackLayouts {
                     print(
@@ -177,13 +164,12 @@ public enum LayoutSystem {
                     proposedWidth = Double(proposedSize.x)
             }
 
-            let childResult = child.update(
+            let childResult = child.computeLayout(
                 proposedSize: SIMD2<Int>(
                     Int(proposedWidth.rounded(.towardZero)),
                     Int(proposedHeight.rounded(.towardZero))
                 ),
-                environment: environment,
-                dryRun: dryRun
+                environment: environment
             )
 
             renderedChildren[index] = childResult
@@ -247,53 +233,13 @@ public enum LayoutSystem {
                     + totalSpacing
         }
 
-        if !dryRun {
-            backend.setSize(of: container, to: size)
-
-            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):
-                        x = 0
-                    case (.horizontal, .leading):
-                        y = 0
-                    case (.vertical, .center):
-                        x = (size.x - childSize.size.size.x) / 2
-                    case (.horizontal, .center):
-                        y = (size.y - childSize.size.size.y) / 2
-                    case (.vertical, .trailing):
-                        x = (size.x - childSize.size.size.x)
-                    case (.horizontal, .trailing):
-                        y = (size.y - childSize.size.size.y)
-                }
-
-                backend.setPosition(ofChildAt: index, in: container, to: SIMD2<Int>(x, y))
-
-                switch orientation {
-                    case .horizontal:
-                        x += childSize.size.size.x + spacing
-                    case .vertical:
-                        y += childSize.size.size.y + spacing
-                }
-            }
-        }
-
         // If the stack has been told to inherit its stack layout participation
         // and all of its children are hidden, then the stack itself also
         // shouldn't participate in stack layouts.
         let shouldGetIgnoredInStackLayouts =
             inheritStackLayoutParticipation && isHidden.allSatisfy { $0 }
 
-        return ViewUpdateResult(
+        return ViewLayoutResult(
             size: ViewSize(
                 size: size,
                 idealSize: idealSize,
@@ -308,4 +254,57 @@ public enum LayoutSystem {
             childResults: renderedChildren
         )
     }
+
+    public static func commitStackLayout<Backend: AppBackend>(
+        container: Backend.Widget,
+        children: [LayoutableChild],
+        layout: ViewLayoutResult,
+        environment: EnvironmentValues,
+        backend: Backend
+    ) {
+        let size = layout.size.size
+        backend.setSize(of: container, to: size)
+
+        let renderedChildren = children.map { $0.commit() }
+
+        let alignment = environment.layoutAlignment
+        let spacing = environment.layoutSpacing
+        let orientation = environment.layoutOrientation
+
+        var x = 0
+        var y = 0
+        for (index, child) 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 !child.participatesInStackLayouts {
+                continue
+            }
+
+            // Compute alignment
+            switch (orientation, alignment) {
+                case (.vertical, .leading):
+                    x = 0
+                case (.horizontal, .leading):
+                    y = 0
+                case (.vertical, .center):
+                    x = (size.x - child.size.size.x) / 2
+                case (.horizontal, .center):
+                    y = (size.y - child.size.size.y) / 2
+                case (.vertical, .trailing):
+                    x = (size.x - child.size.size.x)
+                case (.horizontal, .trailing):
+                    y = (size.y - child.size.size.y)
+            }
+
+            backend.setPosition(ofChildAt: index, in: container, to: SIMD2<Int>(x, y))
+
+            switch orientation {
+                case .horizontal:
+                    x += child.size.size.x + spacing
+                case .vertical:
+                    y += child.size.size.y + spacing
+            }
+        }
+    }
 }

Sources/SwiftCrossUI/Layout/ViewUpdateResult.swift

@@ -1,4 +1,4 @@
-public struct ViewUpdateResult {
+public struct ViewLayoutResult {
     public var size: ViewSize
     public var preferences: PreferenceValues
 
@@ -12,7 +12,7 @@ public struct ViewUpdateResult {
 
     public init(
         size: ViewSize,
-        childResults: [ViewUpdateResult],
+        childResults: [ViewLayoutResult],
         preferencesOverlay: PreferenceValues? = nil
     ) {
         self.size = size
@@ -24,7 +24,7 @@ public struct ViewUpdateResult {
     }
 
     public static func leafView(size: ViewSize) -> Self {
-        ViewUpdateResult(size: size, preferences: .default)
+        ViewLayoutResult(size: size, preferences: .default)
     }
 
     public var participatesInStackLayouts: Bool {

Sources/SwiftCrossUI/Scenes/WindowGroupNode.swift

@@ -102,7 +102,7 @@ public final class WindowGroupNode<Content: View>: SceneGraphNode {
         backend: Backend,
         environment: EnvironmentValues,
         windowSizeIsFinal: Bool = false
-    ) -> ViewUpdateResult {
+    ) -> ViewLayoutResult {
         guard let window = window as? Backend.Window else {
             fatalError("Scene updated with a backend incompatible with the window it was given")
         }
@@ -136,7 +136,7 @@ public final class WindowGroupNode<Content: View>: SceneGraphNode {
             }
             .with(\.window, window)
 
-        let dryRunResult: ViewUpdateResult?
+        let dryRunResult: ViewLayoutResult?
         if !windowSizeIsFinal {
             // Perform a dry-run update of the root view to check if the window
             // needs to change size.