使用SKShapeNode和CGPath在Sprite Kit中绘制虚线 [英] Drawing dashed line in Sprite Kit using SKShapeNode and CGPath

问题描述

我想在我的精灵套件游戏中绘制一条虚线，我可以使用SKShapeNode节点绘制如下的法线：

  UIBezierPath * _path = [UIBezierPath bezierPath]; 
 // 1 
 CGPoint point1 = CGPointMake（100,100）; 
 CGPoint point2 = CGPointMake（150,150）; 
 [_path moveToPoint：point1]; 
 [_path addLineToPoint：point2]; 
 // 2 
 SKShapeNode * line = [SKShapeNode node]; 
 line.path = _path.CGPath; 
  

我试图将虚线模式设置为UIBezierPath，如下所示：

  //在上面的位置1或2处添加此代码但不起作用
 CGFloat破折号[] = {6,2}; 
 [_path setLineDash：破折号：2阶段：0]; 
  

但未应用虚线图案。

<我还尝试直接从UIBezierpath.CGPath属性创建CGPath的虚线副本：

  CGFloat dashes [] = { 6,2}; 
 CGPathRef aCGPath = CGPathCreateCopyByDashingPath（_path.CGPath，NULL，0，dashes，2）; 
 line.path = aCGPath; 
  

但也一样。

如果有人能解释问题是什么我真的很感激，如何通过将虚线cgpath应用于skshapenode来在两点之间画一条虚线。

编辑：我知道这个简单的例子我可以将这两个点之间的距离分成小的固定距离，并通过bezeirpath移动和绘制虚线但是考虑一个带有点来自触摸的自由手路径，使用固定长度的点重绘路径然后绘制破折号是非常复杂和低效的。我想知道是否有办法将虚线模式应用于路径并使skshapenode使用它是我的问题。

解决方案

如果有人仍然对这个问题的简单答案感兴趣：

使用 CGPathCreateCopyByDashingPath 来创建 的虚线副本 - [UIBezierCurve CGPath]

  CGPathRef CGPathCreateCopyByDashingPath（
 CGPathRef路径，
 const CGAffineTransform *转换，
 CGFloat阶段，
 const CGFloat *长度，
 size_t count 
）; 
  

并将其添加到 SKShapeNode 's 路径属性。

示例：

  //创建一个虚线模式
 CGFloat模式[2]; 
 pattern [0] = 10.0; 
 pattern [1] = 10.0; 
 CGPathRef dashed = 
 CGPathCreateCopyByDashingPath（[bezierPath CGPath]，
 NULL，
 0，
 pattern，
 2）; 
 
 self.myShapeNode.path = dashed; 
 
 CGPathRelease（虚线）; 
  

编辑：为了提高性能，你可以添加 SKShapeNode 到 SKEffectNode 并将 shouldRasterize 属性设置为 YES 。

I want to draw a dashed line in my sprite kit game, I can use SKShapeNode node to draw a normal line like the following:

 UIBezierPath *_path=[UIBezierPath bezierPath];
 //1
 CGPoint point1 = CGPointMake(100,100);
 CGPoint point2 = CGPointMake(150,150);
 [_path moveToPoint:point1];
 [_path addLineToPoint:point2];
 //2
 SKShapeNode *line = [SKShapeNode node];
 line.path = _path.CGPath;

I tried to set a dashed pattern to UIBezierPath like this:

// adding this code at location 1 or 2 above but no effect
CGFloat dashes[] = {6, 2};
[_path setLineDash:dashes count:2 phase:0];

but the dashed pattern is not applied.

I also tried to create a dashed copy of CGPath directly from UIBezierpath.CGPath property as:

 CGFloat dashes[] = {6, 2};
 CGPathRef aCGPath= CGPathCreateCopyByDashingPath(_path.CGPath,NULL,0,dashes,2);
line.path = aCGPath;

but also the same.

I really appreciate if someone could explain what is the problem and how can I draw a dashed line between two points by applying dashed cgpath to skshapenode.

Edit: I know for this simple example I could divide the distance between these two points to small fixed distances and moving and drawing dashed line by bezeirpath but consider a free hand path with points came from touches, it is a very complex and inefficient to redraw the path with fixed length points then draw dashes. I wonder if there is a way to apply the dashed pattern to the path and making skshapenode to use it that is my question.

解决方案

If anyone is still interested in a simple answer to this question:

Use CGPathCreateCopyByDashingPath to create a dashed copy of - [UIBezierCurve CGPath]

CGPathRef CGPathCreateCopyByDashingPath(
   CGPathRef path,
   const CGAffineTransform *transform,
   CGFloat phase,
   const CGFloat *lengths,
   size_t count
);

and add it to the SKShapeNode's path property.

Example:

    // creates a dashed pattern
    CGFloat pattern[2];
    pattern[0] = 10.0;
    pattern[1] = 10.0;
    CGPathRef dashed =
    CGPathCreateCopyByDashingPath([bezierPath CGPath],
                                  NULL,
                                  0,
                                  pattern,
                                  2);

    self.myShapeNode.path = dashed;

    CGPathRelease(dashed);

EDIT: For performance, you can add an SKShapeNode to an SKEffectNode and set the shouldRasterize property to YES.

这篇关于使用SKShapeNode和CGPath在Sprite Kit中绘制虚线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！