tarnfeld
tarnfeld

Reputation: 26576

UIWindow rounded corners throughout application

I want to have small rounded corners around the edges of my app (across the whole app) so I figured the best place to do this was on the layer of the main UIWindow created in the AppDelegate class. Here's my code...

[self.window.layer setCornerRadius:30.0f];
[self.window.layer setMasksToBounds:YES];

This does round the corners at the bottom of my window, and slightly at the top. However the window is the full size of the screen (not the screen minus status bar) so I end up with something like this.. http://tfld.me/image/441U0j3w3X3N

I don't really want to add the cornerRadius/masksToBounds option on every layer on all nav controllers/views in my app.. or have a background image (as thats not very future proof).

I have also tried setting these options on the windows rootViewController with no luck - http://tfld.me/image/0c1m2w36402K

Any suggestions much appreciated :)

Upvotes: 2

Views: 2967

Answers (3)

user11182243
user11182243

Reputation:

Swift 4:

    func application(_ application: UIApplication,
                 didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {

        window.layer.cornerRadius = 20.0
        window.layer.masksToBounds = true

Upvotes: 1

Yunus Nedim Mehel
Yunus Nedim Mehel

Reputation: 12389

To do that I have used a small png file which contains 1/4 of a transparent circle (whose radius will be the new radius of the window) and black towards the corner (a designer provided me the image, you may have to do it yourself). I have created 4 imageView s using this png, rotated them accordingly and added them as subviews to navigationController.

Put the following method into your appDelegate and invoke it inside application:didFinishLaunchingWithOptions: method after initializing the navigationController.

-(void) insertCornerRadiiOnNavigationController : (UINavigationController *) navController{

CGFloat cornerRadius = 7;

UIImageView *corner1 = [[UIImageView alloc] initWithFrame:CGRectMake(0, 20, cornerRadius, cornerRadius)];
UIImageView *corner2 = [[UIImageView alloc] initWithFrame:CGRectMake([_window bounds].size.width - cornerRadius, 20, cornerRadius, cornerRadius)];
UIImageView *corner3 = [[UIImageView alloc] initWithFrame:CGRectMake(0, [_window bounds].size.height - cornerRadius, cornerRadius, cornerRadius)];
UIImageView *corner4 = [[UIImageView alloc] initWithFrame:CGRectMake([_window bounds].size.width - cornerRadius, [_window bounds].size.height - cornerRadius, cornerRadius, cornerRadius)];

corner2.transform = CGAffineTransformMakeRotation (M_PI_2);
corner3.transform = CGAffineTransformMakeRotation (3 * M_PI_2);
corner4.transform = CGAffineTransformMakeRotation (M_PI);

[corner1 setImage:[UIImage imageNamed:@"corner.png"]];
[corner2 setImage:[UIImage imageNamed:@"corner.png"]];
[corner3 setImage:[UIImage imageNamed:@"corner.png"]];
[corner4 setImage:[UIImage imageNamed:@"corner.png"]];

[navController.navigationBar addSubview:corner1];
[navController.navigationBar addSubview:corner2];
[navController.view addSubview:corner3];
[navController.view addSubview:corner4];

[corner1 release];
[corner2 release];
[corner3 release];
[corner4 release];
}

For some reason I could not add them to UIWindow directly, the imageViews did not appear.

Upvotes: 0

Raghunandan  R
Raghunandan R

Reputation: 174

If you want the navigation bar to be curved you can used appropriate image. If not then the below code should work as per your need:

    self.window = [[[UIWindow alloc] init] autorelease];
    //shift the window frame by 20 px so that it goes below status bar
    CGRect sampleRect = [[UIScreen mainScreen] bounds];
    sampleRect.origin.y += 20.0;
    sampleRect.size.height -= 20.0;
    self.window.frame = sampleRect;

    UIViewController *vc = [[UIViewController alloc] init];
    vc.view.frame = [[UIScreen mainScreen] bounds];

    UINavigationController *mRootController = [[UINavigationController alloc] initWithRootViewController:vc];
    CGRect navFrame = mRootController.view.frame;
    navFrame.origin.y -= 20.0; //Shift the navigation frame up by 20 px
    mRootController.view.frame = navFrame;

    [self.window addSubview:mRootController.view];
    [self.window.layer setCornerRadius:20.0f];
    [self.window.layer setMasksToBounds:YES];

Upvotes: 2

Related Questions