-
-
Save rcholic/dd4c1b81a91d408de7d411a4a5ca5d27 to your computer and use it in GitHub Desktop.
UIBezierPath category to create an arrow (now with a Swift version!)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Swift 2.2 syntax / API | |
import UIKit | |
extension UIBezierPath { | |
class func arrow(from start: CGPoint, to end: CGPoint, tailWidth: CGFloat, headWidth: CGFloat, headLength: CGFloat) -> Self { | |
let length = hypot(end.x - start.x, end.y - start.y) | |
let tailLength = length - headLength | |
func p(_ x: CGFloat, _ y: CGFloat) -> CGPoint { return CGPoint(x: x, y: y) } | |
var points: [CGPoint] = [ | |
p(0, tailWidth / 2), | |
p(tailLength, tailWidth / 2), | |
p(tailLength, headWidth / 2), | |
p(length, 0), | |
p(tailLength, -headWidth / 2), | |
p(tailLength, -tailWidth / 2), | |
p(0, -tailWidth / 2) | |
] | |
let cosine = (end.x - start.x) / length | |
let sine = (end.y - start.y) / length | |
var transform = CGAffineTransform(a: cosine, b: sine, c: -sine, d: cosine, tx: start.x, ty: start.y) | |
let path = CGPathCreateMutable() | |
CGPathAddLines(path, &transform, &points, points.count) | |
CGPathCloseSubpath(path) | |
return self.init(CGPath: path) | |
} | |
} | |
// Example call: | |
let arrow = UIBezierPath.arrow(from: CGPointMake(50, 100), to: CGPointMake(200, 50), | |
tailWidth: 10, headWidth: 25, headLength: 40) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#import <UIKit/UIKit.h> | |
@interface UIBezierPath (dqd_arrowhead) | |
+ (UIBezierPath *)dqd_bezierPathWithArrowFromPoint:(CGPoint)startPoint | |
toPoint:(CGPoint)endPoint | |
tailWidth:(CGFloat)tailWidth | |
headWidth:(CGFloat)headWidth | |
headLength:(CGFloat)headLength; | |
@end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// To the extent possible under law, I (Rob Mayoff, the author of this work) have waived | |
// all copyright and related or neighboring rights to this work, in accordance with | |
// the CC0 1.0 Universal Public Domain Dedication. Please see this page | |
// for details: http://creativecommons.org/publicdomain/zero/1.0/ | |
#import "UIBezierPath+dqd_arrowhead.h" | |
#define kArrowPointCount 7 | |
@implementation UIBezierPath (dqd_arrowhead) | |
+ (UIBezierPath *)dqd_bezierPathWithArrowFromPoint:(CGPoint)startPoint | |
toPoint:(CGPoint)endPoint | |
tailWidth:(CGFloat)tailWidth | |
headWidth:(CGFloat)headWidth | |
headLength:(CGFloat)headLength { | |
CGFloat length = hypotf(endPoint.x - startPoint.x, endPoint.y - startPoint.y); | |
CGPoint points[kArrowPointCount]; | |
[self dqd_getAxisAlignedArrowPoints:points | |
forLength:length | |
tailWidth:tailWidth | |
headWidth:headWidth | |
headLength:headLength]; | |
CGAffineTransform transform = [self dqd_transformForStartPoint:startPoint | |
endPoint:endPoint | |
length:length]; | |
CGMutablePathRef cgPath = CGPathCreateMutable(); | |
CGPathAddLines(cgPath, &transform, points, sizeof points / sizeof *points); | |
CGPathCloseSubpath(cgPath); | |
UIBezierPath *uiPath = [UIBezierPath bezierPathWithCGPath:cgPath]; | |
CGPathRelease(cgPath); | |
return uiPath; | |
} | |
+ (void)dqd_getAxisAlignedArrowPoints:(CGPoint[kArrowPointCount])points | |
forLength:(CGFloat)length | |
tailWidth:(CGFloat)tailWidth | |
headWidth:(CGFloat)headWidth | |
headLength:(CGFloat)headLength { | |
CGFloat tailLength = length - headLength; | |
points[0] = CGPointMake(0, tailWidth / 2); | |
points[1] = CGPointMake(tailLength, tailWidth / 2); | |
points[2] = CGPointMake(tailLength, headWidth / 2); | |
points[3] = CGPointMake(length, 0); | |
points[4] = CGPointMake(tailLength, -headWidth / 2); | |
points[5] = CGPointMake(tailLength, -tailWidth / 2); | |
points[6] = CGPointMake(0, -tailWidth / 2); | |
} | |
+ (CGAffineTransform)dqd_transformForStartPoint:(CGPoint)startPoint | |
endPoint:(CGPoint)endPoint | |
length:(CGFloat)length { | |
CGFloat cosine = (endPoint.x - startPoint.x) / length; | |
CGFloat sine = (endPoint.y - startPoint.y) / length; | |
return (CGAffineTransform){ cosine, sine, -sine, cosine, startPoint.x, startPoint.y }; | |
} | |
@end |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment