Làm thế nào để đường cong bóng đuôi (đơn giản hình dạng tam giác)

Question

Tôi có một hình tam giác đơn giản (đóng vai trò như một cái đuôi bóng) mà tôi đang cố gắng để đường cong như sau:

Tôi có đuôi hình dạng lưu trữ trong một CGMutablePathRef và nó rút ra như sau:

- (void) drawPaths 
{ 
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGContextAddPath(context, self.mutablePath); 

    CGPathRelease(mutablePath); 
    CGColorRelease(fillColor); 
    CGColorRelease(strokeColor); 

} 

tôi cố gắng để làm cho nó để khi tôi nhập vào một số góc để thuật toán này (nói 45 độ) mà quay đuôi và các đường cong giống như các bức ảnh trên . Sự xoay vòng rõ ràng là một sự biến đổi dễ dàng, nhưng việc chuyển nó thành đường cong là điều tôi đang đấu tranh. Tôi nhận ra rằng tôi có thể cần phải sử dụng: CGPathAddQuadCurveToPoint tuy nhiên tôi đang gặp khó khăn khi hiểu những gì để thiết lập như là điểm kiểm soát của tôi và đang nhận được kết quả không thể đoán trước. Ngay cả bài đăng tuyệt vời này cũng khiến tôi không biết gì: Given a CGPath, how to make it curve?

Có ai biết cách thực hiện việc này không?

Answer 1

Tôi giả sử bạn có hoặc có thể nhận tọa độ x và y cho cả điểm xuất phát của đường dẫn - phần cuối của đường dẫn trên quả bóng - và cho điểm kết thúc - đầu tam giác - mà bạn muốn mỗi con đường. Hãy gọi điểm gốc (xorig, yorig) và điểm cuối (xend, yend). Để tạo đường cong đường cong, chúng ta cần tính điểm phối hợp đường cong bậc hai hợp lý, chúng ta sẽ gọi (xc, yc). Tôi tin rằng tính toán tọa độ sau đây sẽ tạo ra một đường cong hợp lý cho bạn:

xc = (xorig * 3 + xend)/4; 
yc = (xorig + xend)/2; 
CGPathAddQuadCurveToPoint(mutablePath, NULL, xc, yc, xend, yend). 

Để làm cho đường cong khác nhau, bạn có thể thay đổi trọng số của xorig và xend trong tính toán xc.

Answer 2

 
@interface 
V : UIView 
@end 

@implementation 
V 
{ UIBezierPath* u1; 
    UIBezierPath* u2; 
} 

- (void) 
awakeFromNib 
{ u1 = UIBezierPath.bezierPath; 
    [ u1 
     moveToPoint:CGPointMake(0, 0) 
    ]; 
    [ u1 
     addQuadCurveToPoint:CGPointMake(10, 100) 
     controlPoint:CGPointMake(10, 30) 
    ]; 
    [ u1 
     addQuadCurveToPoint:CGPointMake(20, 0) 
     controlPoint:CGPointMake(10, 30) 
    ]; 
    u1.lineWidth = 3; 
    u1.lineJoinStyle = kCGLineJoinBevel; 

    u2 = UIBezierPath.bezierPath; 
    [ u2 
     moveToPoint:CGPointMake(0, 0) 
    ]; 
    [ u2 
     addQuadCurveToPoint:CGPointMake(50, 60) 
     controlPoint:CGPointMake(10, 30) 
    ]; 
    [ u2 
     addQuadCurveToPoint:CGPointMake(20, 0) 
     controlPoint:CGPointMake(10, 30) 
    ]; 
    u2.lineWidth = 3; 
    u2.lineJoinStyle = kCGLineJoinBevel; 
} 

- (void) 
drawRect:(CGRect)p 
{ CGContextTranslateCTM(UIGraphicsGetCurrentContext(), 100, 100); 
    [ u1 stroke ]; 
    CGContextTranslateCTM(UIGraphicsGetCurrentContext(), 100, 0); 
    [ u2 stroke ]; 
} 

@end 

Kết quả chương trình sau đây. Có lẽ một số gợi ý.

Answer 3

tôi sẽ thí nghiệm đầu tiên với PaintCode để xem những gì loại mã và biến tôi có thể đưa ra.