3

I am using SpriteKit to draw a graph (with the ability to zoom in and pan around).

When I use an SKCropNode to crop the grid of my graph it doesn't crop the desired area. It crops less, no matter if I use a rectangular SKShapeNode or a SKSpriteNode (with image) as .maskNode.

Here is my code:

    //GRID
    let grid = SKCropNode()
    graphViewModel.graphScene.addChild(grid)

    let ratio:CGFloat = 1000 / 500
    let width = (graphViewModel.sceneSize.width*0.95)
    let newSize = CGSize(width: width, height: width/ratio)

    let origin = CGPoint(x: -newSize.width/2.0, y: 0.0)
    let rectangularMask = SKShapeNode(rect: CGRect(origin: origin, size: newSize))
    rectangularMask.fillColor = UIColor.lightGray
    rectangularMask.zPosition = -10.0 //So it appears behind the grid, doesn't affect the cropping
    grid.maskNode = rectangularMask
    graphViewModel.graphScene.addChild(rectangularMask)

Here are two screenshots to illustrate what I mean:

This is the graph with its grid not being cropped. Graph Grid not cropped

This is the graph with the maskNode set. The lightGray Area is the actual rectangularNode and the grid is being cut off a lot less than it ought to be. Graph Grid cropped but wrongly

My scene is scaled so I can zoom in without pixelating. When I disable zooming (setting the scene's size to the view's size) then the bug disappears. Unfortunately I need zooming without any pixel artefacts.

Maybe someone has an idea how to fix this issue. It might also be a SpriteKit Bug.

ferdyyy
  • 515
  • 4
  • 16
  • You can't use a node as both a mask node and a child, that will screw things up – Knight0fDragon Feb 03 '18 at 17:45
  • This is not true. I tried this before I wrote the post and obviously didn't want the node as child and mask for my use case. I only added it as child to show where the node actually lies and how its proportions are. – ferdyyy Feb 04 '18 at 14:03
  • I have encountered this same issue before with somebody on here. It does screw up how things get rendered. As for your actual problem, provide an MVC that people can use to try and fix your bug. It seems weird that SKCropNode would not render in the middle, so something else may be going on. – Knight0fDragon Feb 04 '18 at 14:15
  • I have tried this and the cropped area is always wrong no matter if I delete the last line `graphViewModel.graphScene.addChild(rectangularMask)` or not. I am pretty sure it has to be something related to the scale since I don't get this issue when my scale is 1.0 (compared to 1/3.0, zoomed out) – ferdyyy Feb 04 '18 at 16:37
  • Im not saying it is causing your problem, I am saying it is screwing with your debugging. You are doing something that is out of norm, make an MVC so people can see what you are doing. – Knight0fDragon Feb 04 '18 at 16:40
  • What do you mean by 'MVC' ? I can only refer to it as Model View Controller. What do you want me to post or extract from my code? – ferdyyy Feb 06 '18 at 09:43
  • Sorry, I mean MCVE. A minimum verifiable complete example. Basically create a project with the minimum amount of code possible. In spritekit, you usually only need to share the Gamescene class in the MCVE, since we can create a sample project. Just let us know if anything outside that file changed – Knight0fDragon Feb 06 '18 at 12:14
  • Ah I see, I have currently bypassed the problem by just putting the inverted image with the background color as image color. That way it is just a blank png where I want the graph to shine through. I will, as soon as I have time, create an MCVE with the minimum requirements to reproduce this bug – ferdyyy Feb 09 '18 at 09:45

0 Answers0