Rounded bottom edge of UIView

Question

In App I have subclassed UINavigationBar and as my TitleView I'm setting(in View Controller) custom UIView

[self.playButton setBackgroundColor:[UIColor yellowColor]];
[self.navigationItem setTitleView:self.playButton];

The bottom edge of this view (playButton) should be curved. Not only corners, bot whole bottom edge.To achieve this effect I'm using this code:

CAShapeLayer *maskLayer = [CAShapeLayer layer];
UIBezierPath *path = [[UIBezierPath alloc] init];

[path addCurveToPoint:CGPointMake(self.playButton.frame.size.width, self.playButton.frame.size.height)  controlPoint1:CGPointMake(0, self.playButton.frame.size.height) controlPoint2:CGPointMake(self.playButton.frame.size.width, 60)];
maskLayer.path = path.CGPath;
self.playButton.layer.mask = maskLayer;

But after that code my UIView (playButton) dissapeared! Is this proper way to apply curved bottom edge of UIView?

It should looks like this: https://i.stack.imgur.com/MLbSv.png

may be this is what you are trying to achieve. http://stackoverflow.com/questions/2264083/rounded-uiview-using-calayers-only-some-corners-how — m4n1c, May 14 '13 at 14:16
They are talking about rounding corners, I want to round/curved whole bottom edge. — lvp, May 14 '13 at 14:18
I think one probable reason would be you are forgetting to use movetopoint method which should ideally exist if the functions you use have endpoints specified. In addCurveToPoint method you need to specify the endpoints with the control points. — m4n1c, May 15 '13 at 03:46

score 0 · Answer 1 · answered May 15 '13 at 06:42

0

CAShapeLayer *maskLayer = [CAShapeLayer layer];
[maskLayer setFrame:self.playButton.bounds];
UIBezierPath *path = [UIBezierPath bezierPath];

[path addArcWithCenter:CGPointMake(self.playButton.center.x, -36.0) radius:65.5 startAngle:0 endAngle:2*M_PI clockwise:YES];


//[path closePath];
maskLayer.path = path.CGPath;
self.playButton.layer.mask = maskLayer;

answered May 15 '13 at 06:42

m4n1c

127
8

Unfortunately, when I apply this mask my View (playButton) disappears from main view... – lvp May 15 '13 at 08:46
Please make sure that the play button frame is set. – m4n1c May 15 '13 at 13:21
Yes, frame is set, it code. And still my playButton disappears :( – lvp May 17 '13 at 12:25

score 0 · Accepted Answer · answered Jan 28 '15 at 23:05

Solution:

-(void)roundCorners:(UIRectCorner)corner radius:(float)radius
{   
    _cornerRadius = radius;
    _corner = corner;
    [self setNeedsDisplay];
}

- (void)drawRect:(CGRect)rect {
    // Drawing code
    [super drawRect:rect];

    UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds byRoundingCorners:_corner cornerRadii:CGSizeMake(_cornerRadius, _cornerRadius)];

    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.frame = self.bounds;
    maskLayer.path = maskPath.CGPath;

    self.layer.mask = maskLayer;
}

Rounded bottom edge of UIView

2 Answers2