How to round the corners of a button

Question

I have a rectangle image (jpg) and want to use it to fill the background of a button with rounded corner in xcode.

I wrote the following:

UIButton *button = [[UIButton buttonWithType:UIButtonTypeRoundedRect] retain];
CGRect frame = CGRectMake(x, y, cardWidth, cardHeight);
button.frame = frame;
[button setBackgroundImage:backImage forState:UIControlStateNormal];

However, the button I get with that approach doesn't have its corners rounded: it is instead a plain rectangle that looks exactly like my original image. How can I get instead an image with rounded corner to represent my button?

Thanks!

Solution 1

I tried the following solution with the UITextArea and I expect this will work with UIButton as well.

First of all import this in your .m file -

#import <QuartzCore/QuartzCore.h>

and then in your loadView method add following lines

    yourButton.layer.cornerRadius = 10; // this value vary as per your desire
    yourButton.clipsToBounds = YES;

Solution 2

You can achieve by this RunTime Attributes

we can make custom button.just see screenshot attached.

kindly pay attention :

in runtime attributes to change color of border follow this instruction

1. create category class of CALayer

2. in h file

   @property(nonatomic, assign) UIColor* borderIBColor;
   

3. in m file:

   -(void)setBorderIBColor:(UIColor*)color {
       self.borderColor = color.CGColor;
   }
   
   -(UIColor*)borderIBColor {
       return [UIColor colorWithCGColor:self.borderColor];
   }
   

now onwards to set border color check screenshot

thanks

Solution 3

Pushing to the limits corner radius up to get a circle:

    self.btnFoldButton.layer.cornerRadius = self.btnFoldButton.frame.height/2.0;

If button frame is an square it does not matter frame.height or frame.width. Otherwise use the largest of both ones.

Solution 4

You may want to check out my library called DCKit. It's written on the latest version of Swift.

You'd be able to make a rounded corner button/text field from the Interface builder directly:

It also has many other cool features, such as text fields with validation, controls with borders, dashed borders, circle and hairline views etc.

Solution 5

UIButton* closeBtn = [[UIButton alloc] initWithFrame:CGRectMake(10, 50, 90, 35)];
//Customise this button as you wish then
closeBtn.layer.cornerRadius = 10;
closeBtn.layer.masksToBounds = YES;//Important

View more solutions

Comments

[Avi Cherry]

Also works with the "User Defined Runtime Attributes" inspector

[Jonny]

Just me or is the information in the answer incomplete? It doesn't really work. Update: it works as long as I do not specify borderColor. But then it always uses black for the borderColor.

[Jonny]

Extended answer: The color set in the IB is likely of UIColor type which does not work with borderColor, which is of CGColorRef. Or something like that. So a solution is to create a category on CALayer, with something like @property(nonatomic, assign) UIColor* borderIBColor; (which does not clash with some other name) in header file, and the implementation is: -(void)setBorderIBColor:(UIColor*)color{self.borderColor = color.CGColor;} -(UIColor*)borderIBColor{return [UIColorcolorWithCGColor:self.borderColor];}

[jungledev]

If you don't want a border color, set the borderRadius to 0 and you won't have one!

[Jayprakash Dubey]

What about Swift?

[Krutarth Patel]

@JayprakashDubey i create extension of CALayer.

[Andrew Thomas]

Works for swift also! Just change YES to true.

[Mia]

the attributes are : borderWidth, cornerRadius and borderColor more info stackoverflow.com/a/45089222/1083128