画三angular形的iOS
下面的代码画了一个圆，我怎么修改现有的代码来画一个三angular形呢？
_colorDotLayer = [CALayer layer]; CGFloat width = self.bounds.size.width-6; _colorDotLayer.bounds = CGRectMake(0, 0, width, width); _colorDotLayer.allowsGroupOpacity = YES; _colorDotLayer.backgroundColor = self.annotationColor.CGColor; _colorDotLayer.cornerRadius = width/2; _colorDotLayer.position = CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2); 虽然有几个核心graphics解决scheme，我想添加一个基于核心animation的解决scheme。
- (void)viewDidLoad { [super viewDidLoad]; UIBezierPath* trianglePath = [UIBezierPath bezierPath]; [trianglePath moveToPoint:CGPointMake(0, view3.frame.size.height-100)]; [trianglePath addLineToPoint:CGPointMake(view3.frame.size.width/2,100)]; [trianglePath addLineToPoint:CGPointMake(view3.frame.size.width, view2.frame.size.height)]; [trianglePath closePath]; CAShapeLayer *triangleMaskLayer = [CAShapeLayer layer]; [triangleMaskLayer setPath:trianglePath.CGPath]; UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0,0, size.width, size.height)]; view.backgroundColor = [UIColor colorWithWhite:.75 alpha:1]; view.layer.mask = triangleMaskLayer; [self.view addSubview:view]; }
代码基于我的博客文章： http : //blog.vikingosegundo.de/2013/10/01/hittesting-done-right/
@implementation TriangleView { CAShapeLayer *_colorDotLayer; } - (void)layoutSubviews { [super layoutSubviews]; if (_colorDotLayer == nil) { _colorDotLayer = [CAShapeLayer layer]; _colorDotLayer.fillColor = self.annotationColor.CGColor; [self.layer addSublayer:_colorDotLayer]; } CGRect bounds = self.bounds; CGFloat radius = (bounds.size.width - 6) / 2; CGFloat a = radius * sqrt((CGFloat)3.0) / 2; CGFloat b = radius / 2; UIBezierPath *path = [UIBezierPath bezierPath]; [path moveToPoint:CGPointMake(0, -radius)]; [path addLineToPoint:CGPointMake(a, b)]; [path addLineToPoint:CGPointMake(-a, b)]; [path closePath]; [path applyTransform:CGAffineTransformMakeTranslation(CGRectGetMidX(bounds), CGRectGetMidY(bounds))]; _colorDotLayer.path = path.CGPath; } - (void)awakeFromNib { [super awakeFromNib]; self.annotationColor = [UIColor redColor]; } @end
结果：
示例代码，它是基于这个星球的答案 ：
@implementation TriangleView -(void)drawRect:(CGRect)rect { CGContextRef context = UIGraphicsGetCurrentContext(); int sides = 3; double size = 100.0; CGPoint center = CGPointMake(160.0, 100.0); double radius = size / 2.0; double theta = 2.0 * M_PI / sides; CGContextMoveToPoint(context, center.x, center.y-radius); for (NSUInteger k=1; k<sides; k++) { float x = radius * sin(k * theta); float y = radius * cos(k * theta); CGContextAddLineToPoint(context, center.x+x, center.yy); } CGContextClosePath(context); CGContextFillPath(context); // Choose for a filled triangle // CGContextSetLineWidth(context, 2); // Choose for a unfilled triangle // CGContextStrokePath(context); // Choose for a unfilled triangle } @end
我觉得比这个解决scheme更容易：
UIBezierPath *path = [UIBezierPath new]; [path moveToPoint:(CGPoint){20, 0}]; [path addLineToPoint:(CGPoint){40, 40}]; [path addLineToPoint:(CGPoint){0, 40}]; [path addLineToPoint:(CGPoint){20, 0}]; // Create a CAShapeLayer with this triangular path // Same size as the original imageView CAShapeLayer *mask = [CAShapeLayer new]; mask.frame = self.viewTriangleCallout.bounds; mask.path = path.CGPath;
这是我的白色三angular形：你可以改变点或旋转，如果你想要的：
UIBezierPath *path = [UIBezierPath new]; [path moveToPoint:(CGPoint){0, 0}]; [path addLineToPoint:(CGPoint){40, 0}]; [path addLineToPoint:(CGPoint){20, 20}]; [path addLineToPoint:(CGPoint){0, 0}]; // Create a CAShapeLayer with this triangular path // Same size as the original imageView CAShapeLayer *mask = [CAShapeLayer new]; mask.frame = self.viewTriangleCallout.bounds; mask.path = path.CGPath;
使用UIBezeierPaths
CGFloat radius = 20; CGMutablePathRef path = CGPathCreateMutable(); CGPathMoveToPoint(path, NULL, (center.x + bottomLeft.x) / 2, (center.y + bottomLeft.y) / 2); CGPathAddArcToPoint(path, NULL, bottomLeft.x, bottomLeft.y, bottomRight.x, bottomRight.y, radius); CGPathAddArcToPoint(path, NULL, bottomRight.x, bottomRight.y, center.x, center.y, radius); CGPathAddArcToPoint(path, NULL, center.x, center.y, bottomLeft.x, bottomLeft.y, radius); CGPathCloseSubpath(path); UIBezierPath *bezierPath = [UIBezierPath bezierPathWithCGPath:path]; CGPathRelease(path);