创建一个包含两个CGPoints SpriteKit Swift的行

时间:2015-06-29 06:50:15

标签: ios swift

我正在尝试制作一个简单的应用程序,您可以触摸某个点,并且无论您在何处触摸,精灵都会沿着该点到达屏幕边缘。我想绘制连接精灵的原点(它开始的点)和你触摸的点之间的线段,以及精灵的原点和屏幕边缘的终点之间的线段,这样我就可以看到精灵以及原点,触点和终点的x和y偏移之间的关系。

希望这不会太混乱。

TL; DR:我需要在两点之间画一条线,我不知道如何使用SpriteKit Swift。

提前致谢。

4 个答案:

答案 0 :(得分:15)

这可以使用CGPath和SKShapeNode完成。

让我们从CGPath开始。当我们需要使用一系列形状或线条构造路径时,使用CGPath。路径是连接两个点的线。所以要划一条线:

  1. moveToPoint:它将路径的当前点设置为指定的点。
  2. addLineToPoint:它从当前点到指定点绘制一条直线。                            要么 addCurveToPoint:它根据某些切线和控制点绘制从当前点到指定点的曲线。
  3. 您可以在此处查看文档: http://developer.apple.com/library/mac/#documentation/graphicsimaging/Reference/CGPath/Reference/reference.html

    您需要做的是:

        var path = CGPathCreateMutable()
        CGPathMoveToPoint(path, nil, 100, 100)
        CGPathAddLineToPoint(path, nil, 500, 500)
    

    现在要使路径可见,并为其提供描边颜色,线宽等属性,您可以在SpriteKit中创建一个SKShapeNode并添加路径。

        let shape = SKShapeNode()
        shape.path = path
        shape.strokeColor = UIColor.whiteColor()
        shape.lineWidth = 2
        addChild(shape)
    

    希望这会有所帮助:)。

答案 1 :(得分:6)

逐步遵循THIS教程,您就可以实现这一目标。

考虑以下代码:

override func touchesMoved(touches: NSSet, withEvent event: UIEvent) {
    let location = touches.anyObject()!.locationInNode(scene)
    if let pig = movingPig {
        pig.addMovingPoint(location)
    }
}

这是一种简单的方法。你获得了用户手指的下一个位置,如果你在touchesBegan(_:,withEvent:)中找到了一只猪,如非零的movingPig值所示,你将该猪的位置添加为下一个航路点。

到目前为止,您可以存储猪的路径 - 现在让我们让猪沿着这条路走。将以下代码添加到update()内的GameScene.swift

dt = currentTime - lastUpdateTime
lastUpdateTime = currentTime

enumerateChildNodesWithName("pig", usingBlock: {node, stop in
    let pig = node as Pig
    pig.move(self.dt)
})

你可以看到结果:

enter image description here

绘图线:

目前,只有猪知道它想要旅行的路径,但场景也需要知道这条路来画它。此问题的解决方案是Pig类的新方法。

func createPathToMove() -> CGPathRef? {
    //1
    if wayPoints.count <= 1 {
        return nil
    }
    //2
    var ref = CGPathCreateMutable()

    //3
    for var i = 0; i < wayPoints.count; ++i {
         let p = wayPoints[i]

    //4
    if i == 0 {
        CGPathMoveToPoint(ref, nil, p.x, p.y)
    } else {
        CGPathAddLineToPoint(ref, nil, p.x, p.y)
     }
 }

 return ref
 }

这种绘制猪路径的方法:

func drawLines() {


//1
  enumerateChildNodesWithName("line", usingBlock: {node, stop in
    node.removeFromParent()
  })

  //2
  enumerateChildNodesWithName("pig", usingBlock: {node, stop in
    //3
    let pig = node as Pig
    if let path = pig.createPathToMove() {          
      let shapeNode = SKShapeNode()
      shapeNode.path = path
      shapeNode.name = "line"
      shapeNode.strokeColor = UIColor.grayColor()
      shapeNode.lineWidth = 2
      shapeNode.zPosition = 1

      self.addChild(shapeNode)
    }
  })
}

这是你的结果:

enter image description here

你可以设置猪的路径。

您可以根据需要进行修改。

希望它会有所帮助。

答案 2 :(得分:6)

对于Swift 3,CGPathMoveToPoint方法不再喜欢第二个参数的nil,所以我需要一个新的解决方案。这就是我想出的:

let line_path:CGMutablePath = CGMutablePath()
line_path.move(to: CGPoint(x:x1, y:y1))
line_path.addLine(to: CGPoint(x:x2, y:y2))

答案 3 :(得分:0)

为了简单起见,我将所有必要的内容都拉到了SKShapeNode的扩展名中,该扩展名还允许您创建一个具有startend点的行作为strokeColorstrokeWidth(您可以随时对其进行预设,也可以选择默认值)

extension SKShapeNode {
    convenience init(start: CGPoint,
                     end: CGPoint,
                     strokeColor: UIColor,
                     lineWidth: CGFloat) {
        self.init()

        let path = CGMutablePath()
        path.move(to: start)
        path.addLine(to: end)

        self.path = path
        self.strokeColor = strokeColor
        self.lineWidth = lineWidth
    }
}

基本思想是,它将使用提供的点创建CGMutablePath并将其分配给形状节点以绘制直线。

要调用它:

let horizontalLine = SKShapeNode(start: CGPoint(x: 0, y: 50),
                                 end: CGPoint(x: size.width, y: 50),
                                 strokeColor: .orange,
                                 lineWidth: 2.0)
addChild(horizontalLine)

输出:

enter image description here