CODEWITHSUNDEEP
iphonescreen
htafoya
htafoya

Reputation: 19283

How do I make rounded corners on app screen?

As some of you may have noticed, most (if not all) of system apps show the screen with rounded corners. I mean, the four corners of the device screen look rounded.

However, most of third party apps don't (the corners are 90º), but I've seen some that do, as Facebook messenger. Many others have this effect but only on the splash screen (which may be only a modification to the default.png image file)

Is there a property to achieve this effect?

Upvotes: 9

Views: 5825

Answers (4)

Elad Ben-Israel
Elad Ben-Israel

Reputation: 844

@PsycoDad: This addition to @cocotouch's answer fixed the top part of the screen

CGFloat statusBarHeight = [UIApplication sharedApplication].statusBarFrame.size.height;
CGRect screenBounds = [[UIScreen mainScreen] bounds];
self.window.layer.frame = self.window.layer.bounds = 
  CGRectMake(0, 
             statusBarHeight,
             screenBounds.size.width,
             screenBounds.size.height - statusBarHeight);

Upvotes: 0

topLayoutGuide
topLayoutGuide

Reputation: 1397

If you want the rounded corners over the ENTIRE app, and not have to explicitly recreate them with every different View Controller you want, call it in AppDelegate: (didFinishLaunching method)

[self.window.layer setCornerRadius:20.0];
[self.window.layer setMasksToBounds:YES];
self.window.layer.opaque = NO;

Don't forget to:

#import <QuartzCore/QuartzCore.h>

This way is better because it creates the animation on the WINDOW, and not the VIEW. So you can design the rest of the UI with 90˚ corners, and they'll automatically be rounded. It's much easier calling it once.

It also may be better for performance to rasterize the layer, especially if it lags:

[self.window.layer setShouldRasterize:YES];
[self.window.layer setRasterizationScale:[UIScreen mainScreen].scale];

The above will force the animation/graphic change to "act like an image" without making the UI too heavy. Performance will improve, and rasterize according to Retina or Non-Retina Screens. (This is the [UIScreen] call, as ".scale" returns 2.0 for retina, and 1.0 for non-retina. Very, very simple.

Hope this helped! Tick if so and I'll come back and see! :)

Upvotes: 16

Devang
Devang

Reputation: 11338

// Import QuartzCore.h at the top of the file
#import <QuartzCore/QuartzCore.h>


self.view.layer.backgroundColor = [UIColor orangeColor].CGColor;
self.view.layer.cornerRadius = 20.0;
self.view.layer.frame = CGRectInset(self.view.layer.frame, 20, 20);

Check out the Introduction to CALayers Tutorial. You will get good start up.

Upvotes: 1

jamihash
jamihash

Reputation: 1900

Following will round the corners of a view. You can put it in viewDidLoad: 

#import <QuartzCore/QuartzCore.h>

view.layer.cornerRadius = 7;

Upvotes: 1

Related Questions