2013-07-09 60 views
12

我正在用一些CGRects和Ellipses来制作一个复杂的形状。一旦创建完成,我想要打开这条路。当我抚摸它的路径时,它会抚摸每个形状。有没有办法可以将每个形状合并为一个单独的路径,所以笔画不会相交?将多个CGPath合并为一个路径

enter image description here

int thirds = self.height/3; 

CGPathRef aPath = CGPathCreateMutable(); 

CGRect rectangle = CGRectMake((58 - 10)/2, 46, 10, self.height - 58); 
CGPathAddRect(aPath, nil, rectangle); 

CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, 0, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, thirds, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, thirds * 2, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake(0, self.height - 58, 58, 58)); 
CGPathCloseSubpath(aPath); 
CGPathRef other = CGPathCreateCopy(aPath); 

CAShapeLayer *square = [CAShapeLayer layer]; 
square.fillColor = [UIColor colorWithRed:36/255.0f green:56/255.0f blue:82/255.0f alpha:1.0f].CGColor; 
square.strokeColor = [UIColor colorWithRed:50/255.0f green:70/255.0f blue:96/255.0f alpha:1.0f].CGColor; 
square.path = other; 
[self.layer addSublayer:square]; 

UPDATE

我试着用添加路径一起,我得到了完全相同的结果

CGPathAddPath(aPath, nil, CGPathCreateWithRect(rectangle, nil)); 

CGPathAddPath(aPath, nil, CGPathCreateWithEllipseInRect(CGRectMake((58 - 48)/2, 0, 48, 48), nil)); 
CGPathAddPath(aPath, nil, CGPathCreateWithEllipseInRect(CGRectMake((58 - 48)/2, thirds, 48, 48), nil)); 
CGPathAddPath(aPath, nil, CGPathCreateWithEllipseInRect(CGRectMake((58 - 48)/2, thirds * 2, 48, 48), nil)); 
CGPathAddPath(aPath, nil, CGPathCreateWithEllipseInRect(CGRectMake(0, self.height - 58, 58, 58), nil)); 
+0

'CGPathAddPath(PATH1,NULL,PATH2)' – CodaFi

+0

@CodaFi因此,为每个形状创建一个新路径并使用'CGPathAddPath'? – brenjt

回答

20

如果你想,只有描述的轮廓路径你的路径组成,你需要在参与的形状上执行布尔运算。
这里有一些很好的教程。
如: http://losingfight.com/blog/2011/07/07/how-to-implement-boolean-operations-on-bezier-paths-part-1/

如果你只是想实现一个轮廓的视觉外观,你可以画2个形状图层:

  • 一个填充和
  • 一个通过CGPathCreateCopyByStrokingPath获得路径充满您的原创路径

使用您发布的代码中的形状:

int thirds = self.height/3; 

CGMutablePathRef aPath = CGPathCreateMutable(); 

CGRect rectangle = CGRectMake((58 - 10)/2, 46, 10, self.height - 58); 
CGPathAddRect(aPath, nil, rectangle); 

CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, 0, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, thirds, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake((58 - 48)/2, thirds * 2, 48, 48)); 
CGPathAddEllipseInRect(aPath, nil, CGRectMake(0, self.height - 58, 58, 58)); 
CGPathCloseSubpath(aPath); 

CGPathRef other = CGPathCreateCopyByStrokingPath(aPath, NULL, 12.0, kCGLineCapRound, kCGLineJoinRound, 1.0); 
CAShapeLayer *square = [CAShapeLayer layer]; 
square.fillColor = [UIColor colorWithRed:36/255.0f green:56/255.0f blue:82/255.0f alpha:1.0f].CGColor; 
square.path = other; 
[self.view.layer addSublayer:square]; 

CAShapeLayer *square2 = [CAShapeLayer layer]; 
square2.fillColor = [UIColor colorWithRed:50/255.0f green:70/255.0f blue:96/255.0f alpha:1.0f].CGColor; 
square2.path = aPath; 
[self.view.layer addSublayer:square2]; 

这将得出以下形状:
enter image description here

+0

你先生是天才和学者。感谢您的解释。 – brenjt

+0

欢迎您! –

1

基于托马斯Zoechling的答案

对于swift3

height = self.bounds.size.height 
let thirds = self.height/3 

let aPath: CGMutablePath = CGMutablePath() 
let rect = CGRect(x: (58 - 10)/2, y: 46, width: 10, height: self.height - 58) 
aPath.addRect(rect) 

aPath.addEllipse(in: CGRect(x: (58 - 48)/2, y: 0, width: 48, height: 48)) 
aPath.addEllipse(in: CGRect(x: (58 - 48)/2, y: thirds, width: 48, height: 48)) 
aPath.addEllipse(in: CGRect(x: (58 - 48)/2, y: thirds * 2, width: 48, height: 48)) 
aPath.addEllipse(in: CGRect(x: 0, y: self.height, width: 48, height: 48)) 
aPath.closeSubpath() 

let other: CGPath = aPath.copy(strokingWithWidth: 12, lineCap: .round, lineJoin: .round, miterLimit: 1.0) 
let square = CAShapeLayer() 
square.fillColor = UIColor(red: 36/255.0, green: 56/255.0, blue: 82/255.0, alpha: 1.0).cgColor 
square.path = other 
self.layer.addSublayer(square) 

let square2 = CAShapeLayer() 
square2.fillColor = UIColor(red: 50/255.0, green: 70/255.0, blue: 96/255.0, alpha: 1.0).cgColor 
square2.path = aPath 
self.layer.addSublayer(square2)