地圖的標註不規則視圖實現

前言

如圖效果如何實現?


先給出代碼:

/**
     p1                           p2
     |---------------------------|
     |                           |
     |                           |
     |                           |
     |                           |
     ---------\        /--------- p3
     p7     p6 \      / p4
                    \    /
                     \  /
                      \/
                     p5
     */ 

#define kCornerRadius 6.f
UIBezierPath *path = [UIBezierPath bezierPath];
CGPoint point1 = CGPointMake(0.f, 0.f);//最左邊
CGPoint point2 = CGPointMake(180.f, 0.f);//右上角
CGPoint point3 = CGPointMake(180.f, 57.f - kCornerRadius);//右下角
CGPoint point4 = CGPointMake(100.f, 57.f);//小尖角右邊
CGPoint point5 = CGPointMake(90.f, 64.f);//小尖角中間
CGPoint point6 = CGPointMake(80.f, 57.f);//小尖角左邊
CGPoint point7 = CGPointMake(0.f + kCornerRadius, 57.f);//左下角

[path moveToPoint:point1];
[path addLineToPoint:point2];
[path addLineToPoint:point3];
#define DEGREES_TO_RADIANS(degrees) ((3.14159265359 * degrees) / 180)

[path addArcWithCenter:CGPointMake(180 - kCornerRadius, 57-6) radius:kCornerRadius startAngle:DEGREES_TO_RADIANS(0) endAngle:DEGREES_TO_RADIANS(90) clockwise:YES];
 
[path addLineToPoint:point4];
[path addLineToPoint:point5];
[path addLineToPoint:point6];
[path addLineToPoint:point7];

[path addArcWithCenter:CGPointMake(kCornerRadius, 57 - kCornerRadius) radius:kCornerRadius startAngle:DEGREES_TO_RADIANS(90) endAngle:DEGREES_TO_RADIANS(180) clockwise:YES];
[path closePath];

CAShapeLayer *shapLayer = [CAShapeLayer layer];
shapLayer.cornerRadius = kCornerRadius;
shapLayer.path = path.CGPath;

self.layer.mask = shapLayer;

原理:

參考

https://blog.csdn.net/longlongValue/article/details/55045254

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章