ios - 将 SKShapeNode 放置在彼此之上以获得图形效果

Question

我有一个任意形状的非自相交多边形 SKShapeNode A。作为图形效果，我想将另一个比例为 0.7 的 SKShapeNode B 放置在 A 顶部。

我迷失在 Sprite-Kits 坐标系中。我无法让 SKShapeNode B 正确定位。这应该是一个简单的问题，但我坚持了下来。感谢所有帮助!

                    createdShape.name = "whiteArea"
                    createdShape.strokeColor = shapeBorderColor
                    createdShape.lineWidth = 0.0
                    createdShape.fillColor = shapeFillColor
                    createdShape.alpha = 1.0
                    createdShape.zPosition = shapeZPosition
                    createdShape.glowWidth = 3.0

                    let graphicAddonShape = createdShape.copy() as! SKShapeNode 
                    graphicAddonShape.setScale(0.7)
                    graphicAddonShape.lineWidth = 0
                    graphicAddonShape.zPosition = shapeZPosition + 1
                    graphicAddonShape.fillColor = UIColor(red:  15/255, green: 15/255, blue: 15/255, alpha: 1.0)
                    graphicAddonShape.name = "blackArea"
                    graphicAddonShape.physicsBody = nil

                    graphicAddonShape.position.x = createdShape.frame.width/2 - graphicAddonShape.frame.width/2
                    graphicAddonShape.position.y = createdShape.frame.height/2 - graphicAddonShape.frame.height/2
                    createdShape.addChild(graphicAddonShape)
                    self.addChild(createdShape)

Answer 1

这是一个使用您的代码的完整 Xcode Playground ，加上我在顶部添加了一些代码来创建场景并为描边和填充颜色等设置一些变量。

//: Playground - noun: a place where people can play

import UIKit
import SpriteKit
import XCPlayground

let sceneView = SKView(frame: CGRect(x: 0, y: 0, width: 480, height: 320))

let scene = SKScene(size: CGSize(width: 480, height: 320))

sceneView.presentScene(scene)

XCPShowView("My Scene", view: sceneView)

var createdShape = SKShapeNode(circleOfRadius: 35)
let shapeBorderColor = SKColor.greenColor()
let shapeFillColor = SKColor.yellowColor()
let shapeZPosition: CGFloat = 1.0
scene.backgroundColor = SKColor.grayColor()

createdShape.name = "whiteArea"
createdShape.strokeColor = shapeBorderColor
createdShape.lineWidth = 0.0
createdShape.fillColor = shapeFillColor
createdShape.alpha = 1.0
createdShape.zPosition = shapeZPosition
createdShape.glowWidth = 3.0

createdShape.position = CGPoint(x: 150, y: 150)

let graphicAddonShape = createdShape.copy() as! SKShapeNode
graphicAddonShape.setScale(0.7)
graphicAddonShape.lineWidth = 0
graphicAddonShape.zPosition = shapeZPosition + 1
graphicAddonShape.fillColor = UIColor(red:  15/255, green: 15/255, blue: 15/255, alpha: 1.0)
graphicAddonShape.name = "blackArea"

graphicAddonShape.position = CGPointZero // This will be in it's parent co-ordinate system
createdShape.addChild(graphicAddonShape)
scene.addChild(createdShape)

要查看输出，您必须转到“ View ”->“助理编辑器”->“显示辅助编辑器”。

您会看到我将graphicAddonShape 的位置设置为CGPoint(0,0)。 SKShapeNode 的 position 属性引用它的中心，因此我们将 graphicAddonShape 的中心放在其父级 (createdShape) 的位置 (0,0) 处code>) 坐标系，即 createdShape 的中心。要查看差异，请将最后一行的第二行更改为:

createdShape.addChild(graphicAddonShape) 

至

scene.addChild(graphicAddonShape)

查看黑色圆圈如何根据其父级定位。