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

回答1:

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

回答2:

Yes it's possible. You could attach a mask layer to your view's layer, and "punch out" the center portion of the mask. It would actually be quite easy.

回答3:

You create a view as subclass of UIView and add these codes: In YourView.h

#import <UIKit/UIKit.h>

@interface YourView : UIView

@property (nonatomic, assign) CGRect rectForClearing;
@property (nonatomic, strong) UIColor *overallColor;

@end

In YourView.m

#import "YourView.h"

@implementation NBAMiddleTransparentView

- (id)initWithFrame:(CGRect)frame 
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        self.backgroundColor = [UIColor clearColor];
    }
    return self;
}
- (id)initWithCoder:(NSCoder *)aDecoder // support init from nib
{
    self = [super initWithCoder:aDecoder];
    if (self) {
        // Initialization code
        self.backgroundColor = [UIColor clearColor];
    }
    return self;
}

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
    // Drawing code
    [super drawRect:rect];
    CGContextRef ct = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(ct, self.overallColor.CGColor);
    CGContextFillRect(ct, self.bounds);
    CGContextClearRect(ct, self.rectForClearing);
}

@end

Using:

yourView.overallColor = [UIColor redColor];
yourView.rectForClearing = CGRectMake(20, 20, 20, 20);

Hope this helps!

来源：https://stackoverflow.com/questions/24196784/uiview-with-transparent-in-middle

标签

ios

objective-c

uiview

transparent