SceneKit中如何将动态位置的SCNNode按堆栈形式排列

不需要硬编码坐标，直接通过节点动态返回的包围盒尺寸计算偏移即可实现任意动态节点的堆栈排列，支持自定义堆叠方向、间距和对齐规则，适配所有动态生成的节点内容。

核心实现思路 #

堆栈排布的本质是沿指定轴向（常用垂直Y轴做上下堆叠，也可选择X轴做横向排列、Z轴做纵深排列），逐个累加前序节点的占位长度+预留间距，作为当前节点的轴向位置；非堆叠轴向可根据对齐规则（居中、边缘对齐）调整位置，所有尺寸参数全部从节点自身的boundingBox属性动态读取，不需要提前预知节点的大小、形状。

具体实现步骤 #

• 预先定义堆栈配置：堆叠轴向、节点间距、非堆叠轴向的对齐规则
• 初始化轴向偏移量为0，从第一个节点开始遍历
• 读取当前节点的包围盒极值，计算节点在堆叠轴向上的长度，结合当前偏移量设置节点位置
• 累加当前节点长度+预留间距，更新偏移量用于下一个节点的位置计算
• 所有节点排布完成后，可根据需求整体偏移堆栈，让整个堆栈居中/对齐到父节点的指定位置

可直接复用的代码示例 #

import SceneKit

enum StackAlignment {
    case start, center, end
}

/// 动态堆栈排列SCNNode
/// - Parameters:
///   - nodes: 待排列的节点数组，按传入顺序从轴向起点往终点排列
///   - stackAxis: 堆叠参考轴向
///   - spacing: 相邻节点的预留间距
///   - alignment: 非堆叠轴向的对齐规则
///   - originOffset: 整个堆栈的起始坐标偏移
func arrangeStackNodes(
    nodes: [SCNNode],
    stackAxis: SCNVector3.Axis,
    spacing: Float = 0.05,
    alignment: StackAlignment = .center,
    originOffset: SCNVector3 = .zero
) {
    var axisOffset: Float = 0
    
    for node in nodes {
        let (minBound, maxBound) = node.boundingBox
        let nodeSize = SCNVector3(
            maxBound.x - minBound.x,
            maxBound.y - minBound.y,
            maxBound.z - minBound.z
        )
        var nodePos = originOffset
        
        switch stackAxis {
        case .y:
            // 沿Y轴堆叠时，逐节点累加Y向偏移
            nodePos.y += axisOffset + nodeSize.y / 2
            // X、Z轴按对齐规则调整
            let xOffset: Float = switch alignment {
            case .start: nodeSize.x / 2
            case .center: 0
            case .end: -nodeSize.x / 2
            }
            let zOffset: Float = switch alignment {
            case .start: nodeSize.z / 2
            case .center: 0
            case .end: -nodeSize.z / 2
            }
            nodePos.x += xOffset
            nodePos.z += zOffset
            // 更新Y向累计偏移
            axisOffset += nodeSize.y + spacing
            
        case .x:
            // 沿X轴堆叠
            nodePos.x += axisOffset + nodeSize.x / 2
            let yOffset: Float = switch alignment {
            case .start: nodeSize.y / 2
            case .center: 0
            case .end: -nodeSize.y / 2
            }
            let zOffset: Float = switch alignment {
            case .start: nodeSize.z / 2
            case .center: 0
            case .end: -nodeSize.z / 2
            }
            nodePos.y += yOffset
            nodePos.z += zOffset
            axisOffset += nodeSize.x + spacing
            
        case .z:
            // 沿Z轴堆叠
            nodePos.z += axisOffset + nodeSize.z / 2
            let xOffset: Float = switch alignment {
            case .start: nodeSize.x / 2
            case .center: 0
            case .end: -nodeSize.x / 2
            }
            let yOffset: Float = switch alignment {
            case .start: nodeSize.y / 2
            case .center: 0
            case .end: -nodeSize.y / 2
            }
            nodePos.x += xOffset
            nodePos.y += yOffset
            axisOffset += nodeSize.z + spacing
            
        @unknown default: break
        }
        
        node.position = nodePos
    }
}

使用说明 #

• 节点的boundingBox会自动计算自身包含的所有子节点、几何体的总边界范围，哪怕节点是动态加载的模型、带缩放动画，都能拿到准确的尺寸，不需要手动计算子节点大小
• 如果需要实现类似UIStackView的动态刷新效果，只要在节点内容变更（替换几何体、缩放尺寸、增删节点）时重新调用该方法即可
• 如果需要让整个堆栈在父节点中居中，可以在排布完成后，用总偏移量减去（总长度/2）作为所有节点的轴向偏移修正值

注意：如果自定义过节点的pivot锚点位置，需要对应调整偏移量的半长计算逻辑，默认锚点在节点中心的场景下上述代码可以直接运行。

内容的提问来源于stack exchange，提问作者Joice George