Custom draw rect is overlayed by background color

Question

I created a custom UIView to draw a "hole" ontop of a background

@implementation MaskWithHole

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {

        self.hole = CGRectZero;
        self.holeColor = [UIColor clearColor];
    }
    return self;
}

-(UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    return nil;
}
-(void)setHole:(CGRect)hole
{
    _hole = hole;
    [self setNeedsDisplay];
}

-(void)setHoleColor:(UIColor *)holeColor
{
    _holeColor = holeColor;
    [self setNeedsDisplay];
}


- (void)drawRect:(CGRect)rect
{

    [self.backgroundColor setFill];
    UIRectFill(rect);

    // clear the background in the given rectangles

    CGRect holeRect = self.hole;
    CGRect holeRectIntersection = CGRectIntersection( holeRect, rect );
    [self.holeColor setFill];
    UIRectFill(holeRectIntersection);

}


@end

But the custom drawing is always the background color - disregarding the drawRect code

CGRect holeRect = self.hole;
    CGRect holeRectIntersection = CGRectIntersection( holeRect, rect );
    [self.holeColor setFill];
    UIRectFill(holeRectIntersection);

when I change the color of the hole from clear to green i can see the green- so apperantly the method is drawing teh background on everything

So you want a view with a background colour and a transparent section that allows you to see through to the view underneath it on the screen? — Wain, Apr 06 '14 at 09:26
yes . i want the background color to be set - and the hole to be a different color - for instance transparent or maybe another color — Avba, Apr 06 '14 at 09:33
possible duplicate of [Cut transparent hole in UIView](http://stackoverflow.com/questions/9711248/cut-transparent-hole-in-uiview) — Wain, Apr 06 '14 at 09:34

score 0 · Answer 1 · answered Apr 06 '14 at 09:39

0

The easy way to have a transparent hole in the middle of a solid background is using a png image of that size with transparency in the middle, and the solid color outside.

answered Apr 06 '14 at 09:39

rounak

9,217
3
42
59

score 0 · Accepted Answer · answered Apr 06 '14 at 11:45

This seems to work

@interface MaskWithHole : UIView

// default cgrectzero
@property (nonatomic,assign) CGRect hole;

// default [uicolor clearcolor]
@property (nonatomic,strong) UIColor *holeColor;
@end


@interface MaskWithHole ()

@property (nonatomic,strong) UIColor *backGroundColorForMask;
@end
@implementation MaskWithHole

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {

        self.hole = CGRectZero;
        self.holeColor = [UIColor clearColor];
        self.backgroundColor = [UIColor clearColor];
        self.opaque = NO;
    }
    return self;
}

-(UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    return nil;
}
-(void)setHole:(CGRect)hole
{
    _hole = hole;
    [self setNeedsDisplay];
}

-(void)setHoleColor:(UIColor *)holeColor
{
    _holeColor = holeColor;
    [self setNeedsDisplay];
}

-(void)setBackgroundColor:(UIColor *)backgroundColor
{
    [super setBackgroundColor:[UIColor clearColor]];
    self.backGroundColorForMask = backgroundColor;
}
- (void)drawRect:(CGRect)rect
{
    [self.backGroundColorForMask setFill];
    UIRectFill(rect);

    CGRect holeRectIntersection = CGRectIntersection( self.hole, rect );
    [[UIColor clearColor] setFill];
    UIRectFill(holeRectIntersection);
}


@end

Custom draw rect is overlayed by background color

2 Answers2