Kết hợp nhiều CGPath với nhau để tạo một đường dẫn

Question

Tôi đang tạo một hình dạng phức tạp bằng cách sử dụng một vài CGRects và Ellipses. Tôi muốn đột quỵ con đường đó một khi nó đã được tạo ra. Khi tôi đột quỵ con đường nó đột quỵ từng hình dạng. Có cách nào tôi có thể hợp nhất từng hình dạng thành một đường dẫn duy nhất, do đó đột quỵ không giao nhau?

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]; 

CẬP NHẬT

tôi đã cố gắng với việc thêm đường dẫn với nhau và tôi đã cùng kết quả chính xác

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)); 

Answer 1

Nếu bạn muốn có một con đường mà chỉ mô tả những nét chính của thành phần đường dẫn của bạn, bạn cần thực hiện các phép toán boolean trên các hình dạng tham gia.
Có một số hướng dẫn tốt ngoài đó.
Ví dụ: http://losingfight.com/blog/2011/07/07/how-to-implement-boolean-operations-on-bezier-paths-part-1/

Nếu bạn chỉ muốn đạt được sự xuất hiện hình ảnh của một phác thảo, bạn có thể vẽ 2 hình lớp:

• một mà điền vào một con đường thu được thông qua CGPathCreateCopyByStrokingPath và
• một mà điền vào đường dẫn ban đầu của bạn trên đỉnh

Sử dụng hình dạng từ mã bạn đã đăng:

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]; 

Điều đó sẽ vẽ hình dạng sau:

Answer 2

Dựa trên câu trả lời của Thomas Zoechling

Đối 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)