swift and sprite kit drawing a straight line while dragging your finger on the screen

Question

I'm trying to draw a single, straight line using UITouch and Spritekit. Where the line keeps showing during the dragging motion of my finger. if anyone knows a certain tutorial or can run me through the way of doing it i would be thankful

Answer 1

Probably not the best way to implement it, but it's simple. Just copy and paste this into your GameScene.swift

import SpriteKit
import GameplayKit

class GameScene: SKScene {

private var line:SKShapeNode = SKShapeNode()
private var path:CGMutablePath = CGMutablePath()
private var initialPointSet:Bool = false

override func didMove(to view: SKView) {

    line.strokeColor = UIColor.orange
    line.lineWidth = 4
    addChild(line)

}

func touchMoved(toPoint pos : CGPoint) {

    if !initialPointSet {
        path.move(to: pos)
        initialPointSet = true
    }

    path.addLine(to: pos)
    line.path = path
}

override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
    for t in touches { self.touchMoved(toPoint: t.location(in: self)) }
}

}

Answer 2

SpriteKit has some of the worst 2D drawing ever presented in a 2D game engine.

Actually, the worst.

SKShapeNode and its CGPath are atrocious nonsense. It's as if the "designers" of SpriteKit have never once looked at the most primitive of 2D drawing in anything like DirectX or OpenGL. Let alone the kinds of things that animators might want to do with lines and shape creation, mutation, distortion and progress and line animation. ~ Confused

---

Having gotten that little rant off my chest, in the vain hope that it recalibrates your expectations to not expect a drawing style solution, consider this:

SKSpriteNodes can be a simple box, and they can be scaled in both the X and Y axis, and they can be parented to a "dummy" SKNode that rotates to face the direction of the current touch, relative to the original position of the touch.

SO.... you can draw a skinny box, starting at the point of the initial touch, and as the touch is moved, scale the SKSpriteNode to that point by both rotating the SKDummyNode you create to be the parent of your "line", and then scaling it out along that length from the origin to the current position of the touch.

Viola, a LINE!

Of sorts.