ios - 在 SceneKit 节点周围添加边框

Question

我正在尝试使用轻按手势突出显示 SceneKit 中的选定节点。不幸的是，我无法完成它。我能做的最好的事情是在点击节点时更改材质。

let material = key.geometry!.firstMaterial!
material.emission.contents = UIColor.blackColor()

有人可以建议一种我可以在对象周围添加边框或轮廓而不是更改整个节点颜色的方法吗？

Answer 1

基于@Karl Sigiscar的回答和SO中的另一个答案，我想出了这个：

func createLineNode(fromPos origin: SCNVector3, toPos destination: SCNVector3, color: UIColor) -> SCNNode {
    let line = lineFrom(vector: origin, toVector: destination)
    let lineNode = SCNNode(geometry: line)
    let planeMaterial = SCNMaterial()
    planeMaterial.diffuse.contents = color
    line.materials = [planeMaterial]

    return lineNode
}

func lineFrom(vector vector1: SCNVector3, toVector vector2: SCNVector3) -> SCNGeometry {
    let indices: [Int32] = [0, 1]

    let source = SCNGeometrySource(vertices: [vector1, vector2])
    let element = SCNGeometryElement(indices: indices, primitiveType: .line)

    return SCNGeometry(sources: [source], elements: [element])
}


func highlightNode(_ node: SCNNode) {
    let (min, max) = node.boundingBox
    let zCoord = node.position.z
    let topLeft = SCNVector3Make(min.x, max.y, zCoord)
    let bottomLeft = SCNVector3Make(min.x, min.y, zCoord)
    let topRight = SCNVector3Make(max.x, max.y, zCoord)
    let bottomRight = SCNVector3Make(max.x, min.y, zCoord)


    let bottomSide = createLineNode(fromPos: bottomLeft, toPos: bottomRight, color: .yellow)
    let leftSide = createLineNode(fromPos: bottomLeft, toPos: topLeft, color: .yellow)
    let rightSide = createLineNode(fromPos: bottomRight, toPos: topRight, color: .yellow)
    let topSide = createLineNode(fromPos: topLeft, toPos: topRight, color: .yellow)

    [bottomSide, leftSide, rightSide, topSide].forEach {
        $0.name = kHighlightingNode // Whatever name you want so you can unhighlight later if needed
        node.addChildNode($0)
    }
}

func unhighlightNode(_ node: SCNNode) {
    let highlightningNodes = node.childNodes { (child, stop) -> Bool in
        child.name == kHighlightingNode
    }
    highlightningNodes.forEach {
        $0.removeFromParentNode()
    }
}

Answer 2

SCNNode 符合 SCNBoundingVolume 协议。

该协议定义了getBoundingBoxMin:max:方法。

使用它来获取附加到节点的几何体边界框的最小和最大坐标。

然后使用 SceneKit 基元类型SCNGeometryPrimitiveTypeLine来绘制边界框的线条。检查 SCNGeometryElement。

Answer 3

如果您的节点是原始形状，您可以将 a 设置UIImage为diffuse. 图像将被拉伸以覆盖您的节点。如果您使用带有边框的图像，这将转化为在您的节点上创建边框。

planeGeometry.firstMaterial?.diffuse.contents = UIImage(named: "blueSquareOutline.png")