set cornerRadius and setbackgroundimage to UIButton

user1570600 picture user1570600 · Jul 1, 2013 · Viewed 67k times · Source

I am trying to set cornerRadius of UIButton but I dont know how to do it.

If I do like this:

button.layer.cornerRadius = 5;

works well, if I do like this :

button.layer.cornerRadius = 5;
[button setBackgroundColor:[UIColor colorWithPatternImage:radialGradient]];

the corners are not rounded.

I know I could solve this whit

 [button.layer setMasksToBounds:YES];

but I specifically looking for different solution, because I add some arrows to the button and if I set mask to bounds the arrow are masked.

EDIT :

radialGradient is made whit func

+ (UIImage *)getRadialGradientImage:(CGSize)size centre:(CGPoint)centre radius:(float)radius startColor:(UIColor *)startColor endColor:(UIColor *)endColor{

// Initialise
UIGraphicsBeginImageContextWithOptions(size, YES, 1);

// Create the gradient's colours
size_t num_locations = 2;
CGFloat locations[2] = { 0.0, 1.0 };

const CGFloat *component_first = CGColorGetComponents([startColor CGColor]);

CGFloat red1 = component_first[0];
CGFloat green1 = component_first[1];
CGFloat blue1 = component_first[2];

const CGFloat *component_second = CGColorGetComponents([endColor CGColor]);
CGFloat red2 = component_second[0];
CGFloat green2 = component_second[1];
CGFloat blue2 = component_second[2];

const CGFloat components[8] = { red1,green1,blue1,1,red2,green2,blue2,1}; // End color

CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB();
CGGradientRef myGradient = CGGradientCreateWithColorComponents (myColorspace, components, locations, num_locations);

// Normalise the 0-1 ranged inputs to the width of the image
CGPoint myCentrePoint = CGPointMake(centre.x * size.width, centre.y * size.height);
float myRadius = MIN(size.width, size.height) * radius;

// Draw it!
CGContextDrawRadialGradient (UIGraphicsGetCurrentContext(), myGradient, myCentrePoint,
                             0, myCentrePoint, myRadius,
                             kCGGradientDrawsAfterEndLocation);

// Grab it as an autoreleased image
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();

// Clean up
CGColorSpaceRelease(myColorspace); // Necessary?
CGGradientRelease(myGradient); // Necessary?
UIGraphicsEndImageContext(); // Clean up
return image;
}

Answer

Adrian P picture Adrian P · Jul 1, 2013

Here is how I would create a button through code and set its background color.

UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(100, 100, 100,50);
[btn setTitle:@"Hello" forState:UIControlStateNormal];
[btn setBackgroundColor:[UIColor colorWithRed:128.0/255.0f green:0.0/255.0f  blue:0.0/255.0f alpha:0.7]];
btn.frame = CGRectMake(100.0, 100.0, 120.0, 50.0);//width and height should be same  value
btn.clipsToBounds = YES;

btn.layer.cornerRadius = 20;//half of the width
btn.layer.borderColor=[UIColor redColor].CGColor;
btn.layer.borderWidth=2.0f;

[self.view addSubview:btn];

Below is the image of the button that is related with the above code enter image description here

You can always play around with code and create the colors that you need for background and border. Hope this would help you out.