Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UIView with transparent in middle

enter image description here

Is it possible to create such a UIView fill with color, but in the middle is transparent?

I'm thinking about to create 5 UIViews here. Just wondering is it possible to accomplish by using only ONE UIView

like image 465
Js Lim Avatar asked Jun 13 '14 02:06

Js Lim


1 Answers

From Duncan C, I get to know where should I start, then I found CALayer with transparent hole in it.

UIBezierPath *overlayPath = [UIBezierPath bezierPathWithRect:self.view.bounds];
UIBezierPath *transparentPath = [UIBezierPath bezierPathWithRect:CGRectMake(60, 120, 200, 200)];
[overlayPath appendPath:transparentPath];
[overlayPath setUsesEvenOddFillRule:YES];

CAShapeLayer *fillLayer = [CAShapeLayer layer];
fillLayer.path = overlayPath.CGPath;
fillLayer.fillRule = kCAFillRuleEvenOdd;
fillLayer.fillColor = [UIColor colorWithRed:255/255.0 green:20/255.0 blue:147/255.0 alpha:1].CGColor;

[self.view.layer addSublayer:fillLayer];

Make use of 2 UIBezierPath, then fill with color that I want (in my question is pink color), then add as sublayer

like image 187
Js Lim Avatar answered Nov 09 '22 07:11

Js Lim