Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
  • Rounded corner in XIB or storyboard

    • 0
    • 2
    • 1
    • 1
    • 0
    • 0
    • 3
    • 0
    • 3.13k
    Comment on it


    I am writing for the first time on FindNerd. Many times we need to make buttons, labels, imageview, view to have rounded corner. and we write code as below to perform it.

        [redButton.layer setCornerRadius:15.0f];
        [redButton.layer setMasksToBounds:YES];
        [redButton.layer setBorderColor:[UIColor blueColor].CGColor];
        [redButton.layer setBorderWidth:1];

    You can achieve the same behavior from XIB also.

    1. Open XIB and drag a button or a UIView on to the canvas.
    2. Select the button or UIView and click on Show/Hide utilities

      alt text

    3. Click on Show Identity Inspector

      alt text

    4. Below that you will find a section named "User Defined Runtime Attributes"

    5. Click + button and enter the following values:

      Key Path - layer.cornerRadius Type - NSNumber Value - 15

    6. Do this 3 more times and enter the values as shown in screenshot below:

      alt text

    7. You may find that in 3rd value, it is layer.borderIBColor. This is because in few UI components we cannot give a direct color rather we have to give color.CGColor as shown above while doing it from code.

    8. I have created a category on CALayer. You can download the files and include it in project.

    9. Once you have set everything you can Run the application. You will find that the corners are rounded now. If you don't find it in iOS 7 give a background color to UIButton/UIView.

    Please test and give your comments.

    Rounded corner in XIB or storyboard

 0 Comment(s)

Sign In

Sign up using

Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: