I have two uibuttons that a right next to eachother. I would like to make them look joined by giving the left button rounded top left and bottom left corners and the right button top right and bottom right corners.
I have seen several solutions to this but all I have seen break the uieffectview I have behind the button.
You can do it like this:
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.viewOutlet.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerBottomLeft | UIRectCornerBottomRight) cornerRadii:CGSizeMake(10.0, 10.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.view.bounds;
maskLayer.path = maskPath.CGPath;
self.viewOutlet.layer.mask = maskLayer;
Update:
If You need border just create another CAShapeLayer and add it to view's layer as sublayer. Like this (place this code below upper code):
CAShapeLayer *borderLayer = [[CAShapeLayer alloc] init];
borderLayer.frame = self.view.bounds;
borderLayer.path = maskPath.CGPath;
borderLayer.lineWidth = 4.0f;
borderLayer.strokeColor = [UIColor blackColor].CGColor;
borderLayer.fillColor = [UIColor clearColor].CGColor;
[self.viewOutlet.layer addSublayer:borderLayer];
Related
I have created the UIButton with specific position corner radius means left button have top left and bottom left corner radius and right button have top right and bottom right corner radius i have take the button in Xib and give border but i cut from some side i have attach the screenshot below.
Look at right side corner border cut. here is my code
[btn_Newest setBackgroundColor:RGB(28.0, 91.0, 161.0, 1.0)];
[btn_Newest.layer setBorderWidth:1.5];
[btn_Newest.layer setBorderColor:RGB(28.0, 91.0, 161.0, 1.0).CGColor];
[btn_Newest setClipsToBounds:YES];
btn_Newest = (UIButton *)[self setroundCornersOnView:btn_Newest onTopLeft:YES topRight:NO bottomLeft:YES bottomRight:NO radius:7.0];
[btn_Popular setBackgroundColor:viewTopBar.backgroundColor];
[btn_Popular.layer setBorderWidth:1.5];
[btn_Popular.layer setBorderColor:RGB(28.0, 91.0, 161.0, 1.0).CGColor];
[btn_Popular setClipsToBounds:YES];
btn_Popular = (UIButton *)[self setroundCornersOnView:btn_Popular onTopLeft:NO topRight:YES bottomLeft:NO bottomRight:YES radius:7.0];
setroundCornersOnView this function create specific side corner radius.Can any one help me in this situation.
Kindly try the following code. i think it will satisfy your requirements.
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:btnPush.bounds byRoundingCorners:(UIRectCornerTopRight | UIRectCornerBottomRight) cornerRadii:CGSizeMake(7.0, 7.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.view.bounds;
maskLayer.path = maskPath.CGPath;
btnPush.layer.mask = maskLayer;
CAShapeLayer *borderLayer = [[CAShapeLayer alloc] init];
borderLayer.frame = self.view.bounds;
borderLayer.path = maskPath.CGPath;
borderLayer.lineWidth = 1.5f;
borderLayer.strokeColor = [UIColor blackColor].CGColor;
borderLayer.fillColor = [UIColor clearColor].CGColor;
[btnPush.layer addSublayer:borderLayer];
Output :
Instead of setting setroundCornersOnView .You can set cornerRadius to the button.
try below code.
[btn_Newest.layer setCornerRadius:5];
I want to curve inside the top border of UIView like this,
I've tried many ways like UIBezierPath etc.
Help needed.
You can do that using UIBezierPath, Have a look at this answer,
UIBezierPath *maskPath;
maskPath = [UIBezierPath bezierPathWithRoundedRect:_backgroundImageView.bounds
byRoundingCorners:(UIRectCornerBottomLeft | UIRectCornerBottomRight)
cornerRadii:CGSizeMake(3.0, 3.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.bounds;
maskLayer.path = maskPath.CGPath;
_backgroundImageView.layer.mask = maskLayer;
[maskLayer release];
With this we can draw the rounded corners to any side of view.
But If you want to draw rounded edge, Better to take a background image to view.
This question already has answers here:
Giving UIView rounded corners
(21 answers)
How to set cornerRadius for only top-left and top-right corner of a UIView?
(31 answers)
Rounded corners on UIView [duplicate]
(2 answers)
Closed 8 years ago.
I want to use round corner style in my UIView, and here is my code:
UIBezierPath *maskPath1 = [UIBezierPath bezierPathWithRoundedRect:self.styleView1.bounds
byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight
cornerRadii:CGSizeMake(4, 4)];
CAShapeLayer *maskLayer1 = [[CAShapeLayer alloc] init];
maskLayer1.frame = self.styleView1.bounds;
maskLayer1.path = maskPath1.CGPath;
self.styleView1.layer.borderWidth = 1;
[self.styleView1.layer setBorderColor:[[UIColor lightGrayColor] CGColor]];
self.styleView1.layer.mask = maskLayer1;
The effect is like that:
There is blank on the corner, like feather effect in Photoshop.
But what I want is this:
How to make it happen?
If self is a UIViewController or UISplitViewController then self doesn't have bounds, it's a controller.
Try this one:
CGRect bounds = self.view.bounds;
UIBezierPath *maskPath;
maskPath = [UIBezierPath bezierPathWithRoundedRect:self.styleView1.bounds
byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight)
cornerRadii:CGSizeMake(10.0, 10.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = bounds;
maskLayer.path = maskPath.CGPath;
self.styleView1.layer.mask = maskLayer;
You can set radius for top view as below code check (how to set cornerRadius for only bottom-left,bottom-right and top-left corner of a UIView?) for reference.
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:yourView.bounds byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight) cornerRadii:CGSizeMake(10.0, 10.0)];
CAShapeLayer *shapeLayer = [[CAShapeLayer alloc] init];
shapeLayer.frame = yourView.bounds;
shapeLayer.path = path.CGPath;
yourView.layer.mask = shapeLayer;
and you will get following.
I am trying to add rounded corners to only the top corners of my UITableView but the problem is, with the code below, it just makes a black layer over my whole UITableView. How would I fix this?
//Rounded Corners for top corners of UITableView
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:thetableView.bounds
byRoundingCorners:UIRectCornerTopLeft
cornerRadii:CGSizeMake(10.0, 10.0)];
UIBezierPath *maskPath2 = [UIBezierPath bezierPathWithRoundedRect:thetableView.bounds
byRoundingCorners:UIRectCornerTopRight
cornerRadii:CGSizeMake(10.0, 10.0)];
// Create the shape layer and set its path
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = thetableView.bounds;
maskLayer.path = maskPath.CGPath;
CAShapeLayer *maskLayer2 = [CAShapeLayer layer];
maskLayer.frame = thetableView.bounds;
maskLayer.path = maskPath2.CGPath;
// Set the newly created shape layer as the mask for the image view's layer
[thetableView.layer addSublayer:maskLayer];
[thetableView.layer addSublayer:maskLayer2];
the following code works for me for a navigationbar, just change the first line and put your self.tableView:
CALayer *capa = [self.navigationController navigationBar].layer;
[capa setShadowColor: [[UIColor blackColor] CGColor]];
[capa setShadowOpacity:0.85f];
[capa setShadowOffset: CGSizeMake(0.0f, 1.5f)];
[capa setShadowRadius:2.0f];
[capa setShouldRasterize:YES];
//Round
CGRect bounds = capa.bounds;
bounds.size.height += 10.0f; //I'm reserving enough room for the shadow
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:bounds
byRoundingCorners:(UIRectCornerTopLeft | UIRectCornerTopRight)
cornerRadii:CGSizeMake(10.0, 10.0)];
CAShapeLayer *maskLayer = [CAShapeLayer layer];
maskLayer.frame = bounds;
maskLayer.path = maskPath.CGPath;
[capa addSublayer:maskLayer];
capa.mask = maskLayer;
I think the best way to make a background view for the table view which view has rounded top corner.Its just a solution to solve the problem.May be it will help you.
I want to corner radius exact in round shape only bottom corner left and right. I already done it but bottom shape not look like exact round so how can I solve this problem
UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:self.imageView.bounds byRoundingCorners:(UIRectCornerBottomLeft | UIRectCornerBottomRight) cornerRadii:CGSizeMake(10.0, 10.0)];
CAShapeLayer *maskLayer = [[CAShapeLayer alloc] init];
maskLayer.frame = self.imageView.bounds;
maskLayer.path = maskPath.CGPath;
self.imageView.layer.mask = maskLayer;
I have the same issues and I solved it like this :
- (void)setMaskTo:(UIView*)view {
CAShapeLayer *rect = [[CAShapeLayer alloc] init];
[rect setFrame:CGRectMake(self.view.frame.origin.x, self.view.frame.origin.y, self.view.frame.size.width, self.view.frame.size.height/2)];
rect.backgroundColor = ([UIColor grayColor]).CGColor;
UIBezierPath *shape = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,rect.frame.size.height/2,self.view.frame.size.width,self.view.frame.size.height/2)];
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.path = shape.CGPath;
shapeLayer.fillColor = [UIColor grayColor].CGColor;
CAShapeLayer *viewMask = [[CAShapeLayer alloc] init];
[viewMask addSublayer:shapeLayer];
[viewMask addSublayer:rect];
view.layer.mask = viewMask;
}