啥也不說先上個效果圖

Paste_Image.png

這個效果寫起來挺簡單，主要運用下面幾個知識點

• layer 的mask : 圖層蒙版
• layer 的shadowPath ： 繪制自定義形狀陰影
• UIBezierPath ：繪制六邊形路線

說完知識點下面上代碼了

• 繪制六邊形的路線

-(CGPathRef)getCGPath:(CGFloat)viewWidth{
    UIBezierPath * path = [UIBezierPath bezierPath];
    path.lineWidth = 2;
    [[UIColor whiteColor] setStroke];
    [path moveToPoint:CGPointMake((sin(M_1_PI / 180 * 60)) * (viewWidth / 2), (viewWidth / 4))];
    [path addLineToPoint:CGPointMake((viewWidth / 2), 0)];
    [path addLineToPoint:CGPointMake(viewWidth - ((sin(M_1_PI / 180 * 60)) * (viewWidth / 2)), (viewWidth / 4))];
    [path addLineToPoint:CGPointMake(viewWidth - ((sin(M_1_PI / 180 * 60)) * (viewWidth / 2)), (viewWidth / 2) + (viewWidth / 4))];
    [path addLineToPoint:CGPointMake((viewWidth / 2), viewWidth)];
    [path addLineToPoint:CGPointMake((sin(M_1_PI / 180 * 60)) * (viewWidth / 2), (viewWidth / 2) + (viewWidth / 4))];
    [path closePath];
    return path.CGPath;
}

• 繪制一個六邊形的layer，并把image 賦值到contents 上

    CGRect hexagnoRect = self.bounds;
    //繪制一個六邊形的layer，并復制一個image給他的contents
    CALayer *hexagonLayer = [CALayer layer];
    hexagonLayer.frame = hexagnoRect;
    CAShapeLayer * shapLayer = [CAShapeLayer layer];
    shapLayer.lineWidth = 1;
    shapLayer.strokeColor = [UIColor whiteColor].CGColor;
    shapLayer.path = [self getCGPath:hexagnoRect.size.width-20];
    hexagonLayer.mask = shapLayer;
    hexagonLayer.contents = (__bridge id _Nullable)(self.image.CGImage);

• 創(chuàng)建一個CALayer，將六邊形layer 添加到CALayer上,并繪制模糊陰影

    CALayer *completeLayer = [CALayer layer];
    completeLayer.frame = CGRectMake(10, 10, self.bounds.size.width-10, self.bounds.size.height-10);
    [completeLayer addSublayer:hexagonLayer];
    completeLayer.shadowOpacity = 1.0f;
    completeLayer.shadowPath = [self getCGPath:hexagnoRect.size.width];
    completeLayer.shadowOffset = CGSizeMake(-10, -10);
    
    completeLayer.shadowColor = self.hg_shadowColor.CGColor;
    [self.layer addSublayer:completeLayer];

這樣就完成只做了

制作陰影.gif

<a >戳我看Demo</a>
感覺不錯的給個星星哦