Question

当手通过渲染或动画从一个节点指向另一个节点时，我需要在两个spritnodes之间绘制一条线。当我遵循此链接Bobjt的答案Animate Path Drawing in SpriteKit时，线条画对我有用。我在这里使用了片段着色器和顶点着色器的概念。

我已经添加了animatestroke.fsh文件并应用了以下代码..但是手持播放器的动画和线条绘制速度有时不匹配。我的线渲染我给了

strokeLengthFloat +=   0.01

玩家持续时间为1.5：

let moveTosecondObject = SKAction.move(to:  handmovepoint, duration:  1.5 )

这是我的实现代码：

变量声明

var handplayer = SKSpriteNode()
var firstObject = SKSpriteNode()
var secondObject = SKSpriteNode()
var startTrigger: Bool = false

let strokeSizeFactor = CGFloat( 2.0 )
var strokeShader: SKShader!
var strokeLengthUniform: SKUniform!
var _strokeLengthFloat: Float = 0.0
var strokeLengthKey: String!
var strokeLengthFloat: Float {
    get {
        return _strokeLengthFloat
    }
    set( newStrokeLengthFloat ) {
        _strokeLengthFloat = newStrokeLengthFloat
        strokeLengthUniform.floatValue = newStrokeLengthFloat
    }
}

加载方式

   override func didMove(to view: SKView) {
   handplayer = SKSpriteNode(imageNamed: "HandImage.png")
    handplayer.size.width = handplayer.size.width * 0.5
    handplayer.size.height = handplayer.size.height * 0.5
    handplayer.position.x =  firstObject.position 
    self.addChild(handplayer)
    UpdatePosition()
   }

    func UpdatePosition(){


       //Line drawing part
          strokeLengthKey = "u_current_percentage"
          strokeLengthUniform = SKUniform( name: strokeLengthKey, float: 0.0 )
          let uniforms: [SKUniform] = [strokeLengthUniform]
          strokeShader = shaderWithFilename( "animateStroke", fileExtension: "fsh", uniforms: uniforms )
    strokeLengthFloat = 0.0

           let cameraNode = SKCameraNode()
           self.camera = cameraNode

          let lineStartPosition = CGPoint(x:firstObject.frame.origin.x+firstObject.size.width/2,y:firstObject.frame.origin.y-firstObject.size.height*0.2)

           let lineEndPosition = CGPoint(x:secondObject.frame.origin.x+secondObject.size.width/2,y:secondObject.frame.origin.y+secondObject.size.height*1.2)

         let path = CGMutablePath()
         path.move(to: CGPoint(x:  lineStartPosition.x, y:  lineStartPosition.y))
         path.addLine(to: CGPoint(x: : lineEndPosition.x, y:  lineEndPosition.y), transform: CGAffineTransform.identity)

         let strokeWidth = 1.0 * strokeSizeFactor
         let shapeNode = SKShapeNode( path: path )
         shapeNode.lineWidth = strokeWidth
         shapeNode.lineCap = .square
         shapeNode.addChild( cameraNode )
         shapeNode.strokeShader = strokeShader
         shapeNode.calculateAccumulatedFrame()
         self.addChild( shapeNode )


    }

     // center the camera
     cameraNode.position = CGPoint( x: self.frame.size.width/2.0, y: self.frame.size.height/2.0 )


     **Handplayer Rendering part**
       let handmovepoint = CGPoint(x: secondObject.position.x , y: secondObject.position.y + handplayer.size.height*0.1 )

       let moveTosecondObject = SKAction.move(to:  handmovepoint, duration:  1.5 )
    let delay = SKAction.wait(forDuration: 1)
    handplayer.run(SKAction.sequence([ delay ]), completion: {() -> Void in
        self.startTrigger = true

        self.handplayer.run(SKAction.sequence([ moveTosecondObject ]), completion: {() -> Void in
            //self.handplayer.alpha = 0.0


       })

 }
    //line rendering part
    override func update(_ currentTime: TimeInterval) {

    if(startTrigger){

        strokeLengthFloat +=   0.01 

    }

    if startTrigger == true{

        if strokeLengthFloat > 1.0 {
           //once line drawing completed 
             self.startTrigger = false

            print("Line drawing ended")
            self.handplayer.alpha = 0.0
            self.handplayer.removeFromParent()


            }

           }
         }

animatestroke.fsh类

        void main()
       {
       if ( u_path_length == 0.0 ) {
              gl_FragColor = vec4( 0.0, 0.0, 1.0, 1.0 ); // draw blue // this is an error
        } else if ( v_path_distance / u_path_length <= u_current_percentage ) {
              gl_FragColor = vec4( 1.0, 0.0, 0.0, 1.0 ); // draw red
        } else {
              gl_FragColor = vec4( 0.0, 0.0, 0.0, 0.0 ); // draw nothing
        }
  }

我该如何解决？或者，如果有人对实现此方案有其他想法，请分享您的想法。

迅速在spritkit中使用顶点着色器和片段着色器绘制线条

0 个答案: