Xcode 5 Round Rect Buttons

Question

I have an app that incorporates many round rect buttons. However, in xcode 5, those dont exist. How do I get the round rect buttons back? They are essential to my app. Now it just is pressable text. What do I do? I am planning on releasing this app later, if that is relevant.

surprisingly the iOS 7 Maps app has the round rect info button. — Bilbo Baggins, Oct 02 '13 at 07:56

Matthew Korporaal · Accepted Answer · 2016-08-31T15:54:47.230

154

Open the storyboard and choose the button you want to change.
Open the Identity Inspector in the Utility Panel (right panel, 3rd button on top).
Add (+) a new User Defined Runtime Attribute -- Key Path: layer.cornerRadius, Type: Number, Value: {integer}.

The higher the number, the more rounded the corners. 50 is a circle for a standard button (or width/2). You won't see the change in the storyboard, but it will show at runtime.

Screenshot of added attribute

edited Aug 31 '16 at 15:54

answered Aug 06 '14 at 15:58

Matthew Korporaal

2,369
1
20
25

9

Answers like this is why I love SO. Thanks a bunch. – tim Sep 11 '14 at 21:48

score 10 · Answer 2 · edited May 23 '17 at 11:47

10

Here's a similar answer to the one I gave to this question:

-EDIT-
Add: #import <QuartzCore/QuartzCore.h> to the top of your .h file.

If you want rounded corners just ctrl-drag from the button to your .h file, call it something like roundedButton and add this in your viewDidLoad:

CALayer *btnLayer = [roundedButton layer];
[btnLayer setMasksToBounds:YES];
[btnLayer setCornerRadius:5.0f];

To make the button white (or any other colour), select the attributes inspector and scroll down to the View section, select Background and change it to White:

enter image description here

edited May 23 '17 at 11:47

Community

1
1

answered Oct 02 '13 at 10:07

Robert

5,278
43
65
115

4

VERY important. this will not work unless you add #import – skinsfan00atg Nov 26 '13 at 20:11
1

thanks, no worries, just took me a sec so i wanted to share. thanks for the harder work:-) – skinsfan00atg Dec 16 '13 at 15:12
1

This can be set entirely in the Storyboard by adding a user-defined runtime attribute with keypath layer.cornerRadius , type Number, value 5 , etc. – Rafael Nobre Mar 20 '14 at 14:51

score 3 · Answer 3 · edited May 23 '17 at 11:47

3

Set a background image on your buttons with the desired borders, using a stretchable image.

Check this link for a good example: Stretch background image for UIButton

OR, embrace the new iOS7 UI and scrap the borders ... ;-)

edited May 23 '17 at 11:47

Community

1
1

answered Sep 23 '13 at 20:41

CSmith

13,318
3
39
42

score 3 · Answer 4 · answered Jan 05 '16 at 10:17

3

Same can achieved by programmatically.where myView is IBOutlet object.

myView.layer.cornerRadius = 5;
myView.layer.masksToBounds = YES;

answered Jan 05 '16 at 10:17

Avijit Nagare

8,482
7
39
68

score 3 · Answer 5 · answered Mar 09 '16 at 05:18

Swift 2.0:

let sampleButton = UIButton(frame: CGRectMake(100,100,200,100))
  sampleButton.titleLabel?.text = "SAMPLE"
  sampleButton.backgroundColor = UIColor.grayColor()

  //Setting rounded boarder
  sampleButton.layer.cornerRadius = 10
  sampleButton.layer.borderWidth = 1
  sampleButton.layer.borderColor = UIColor.blackColor().CGColor

  self.view.addSubview(sampleButton)

score 3 · Answer 6 · edited Apr 28 '16 at 12:30

3

Click on the button you want to get rounded. Then click on the Identity Inspector on the right top side. There You can see User Defined Runtime Attributes. Click on plus (+)

You wont see the changes in View. You will see it in Runtime

edited Apr 28 '16 at 12:30

brodoll

1,851
5
22
25

answered Apr 28 '16 at 11:44

Syed Uzair Ahmed

144
1
14

score 1 · Answer 7 · answered Dec 29 '16 at 15:59

1

In Swift 3: we can added it viewdidload

  button.layer.cornerRadius = 0.5*button.bounds.size.width
  button.clipsToBounds = true

answered Dec 29 '16 at 15:59

Sandu

436
4
8

Xcode 5 Round Rect Buttons

7 Answers7

Linked