最近有個需求称勋,是仿照微信公眾號做一個界面藐翎,里面有一個彈出菜單。這次我選擇自己繪制彈出菜單紫岩,而不是讓UI切圖规惰。
直接上代碼
// 初始化遮罩
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.strokeColor = [UIColor blueColor].CGColor; //kColorWithRGB(221, 222, 223).CGColor;
maskLayer.lineWidth = 1;
// 設(shè)置遮罩
[self.layer setMask:maskLayer];
// 初始化路徑
UIBezierPath *borderPath = [UIBezierPath bezierPath];
// 遮罩層frame
maskLayer.frame = CGRectMake(0, 0, width, height);
// 設(shè)置path起點
[borderPath moveToPoint:CGPointMake(10 * kScale, 0)];
// 直線,到右上角
[borderPath addLineToPoint:CGPointMake(width - 10 * kScale, 0)];
// 右上角的圓角
[borderPath addQuadCurveToPoint:CGPointMake(width, 10 * kScale) controlPoint:CGPointMake(width, 0)];
// 直線泉蝌,到右下角
[borderPath addLineToPoint:CGPointMake(width, height - 30 * kScale)];
// 右下角的圓角
[borderPath addQuadCurveToPoint:CGPointMake(width - 10 * kScale, height - 20 * kScale) controlPoint:CGPointMake(width, height - 20 * kScale)];
// 直線歇万,到三角的右點起點
[borderPath addLineToPoint:CGPointMake(width / 2 + 15 * kScale, height - 20 * kScale)];
// 直線,到三角的下頂點
[borderPath addLineToPoint:CGPointMake(width / 2, height)];
// 直線勋陪,到三角的左點終點
[borderPath addLineToPoint:CGPointMake(width / 2 - 15 * kScale, height - 20 * kScale)];
// 直線贪磺,到左下角
[borderPath addLineToPoint:CGPointMake(10 * kScale, height - 20 * kScale)];
// 左下角的圓角
[borderPath addQuadCurveToPoint:CGPointMake(0, height - 30 * kScale) controlPoint:CGPointMake(0, height - 20 * kScale)];
// 直線,到左上角
[borderPath addLineToPoint:CGPointMake(0, 10 * kScale)];
// 左上角的圓角
[borderPath addQuadCurveToPoint:CGPointMake(10 * kScale, 0) controlPoint:CGPointMake(0, 0)];
// 將這個path賦值給maskLayer的path
maskLayer.path = borderPath.CGPath;