Xcode 5 Round Rect Buttons

65,647

Solution 1

  1. Open the storyboard and choose the button you want to change.
  2. Open the Identity Inspector in the Utility Panel (right panel, 3rd button on top).
  3. 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

Solution 2

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

Solution 3

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

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

Solution 4

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)

Solution 5

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 ... ;-)

Share:
65,647
user2779450
Author by

user2779450

Updated on December 30, 2020

Comments

  • user2779450
    user2779450 over 3 years

    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.

  • skinsfan00atg
    skinsfan00atg over 10 years
    VERY important. this will not work unless you add #import <QuartzCore/QuartzCore.h>
  • skinsfan00atg
    skinsfan00atg over 10 years
    thanks, no worries, just took me a sec so i wanted to share. thanks for the harder work:-)
  • Rafael Nobre
    Rafael Nobre over 10 years
    This can be set entirely in the Storyboard by adding a user-defined runtime attribute with keypath layer.cornerRadius , type Number, value 5 , etc.
  • tim
    tim almost 10 years
    Answers like this is why I love SO. Thanks a bunch.