Create Rounded UIViews With Shadow

So here is small tip how to create rounded UIViews with shadow.

  • Create simple Window-based Application with name TestApp.
  • Click on File->New file and select Objective-C class with UIView subclass and name it MyView
  • Now open MyView.m and edit initWithFrame part with this code
1
2
3
4
5
6
7
8
9
10
11
12
13
14
- (id)initWithFrame:(CGRect)frame {
  if ((self = [super initWithFrame:frame])) {
      // Initialization code
      [self setBackgroundColor:[UIColor blackColor]];
      [self setAlpha:1];
      [[self layer] setCornerRadius:8];
      [[self layer] setMasksToBounds:NO];
      [[self layer] setShadowColor:[UIColor blackColor].CGColor];
      [[self layer] setShadowOpacity:1.0f];
      [[self layer] setShadowRadius:6.0f];
      [[self layer] setShadowOffset:CGSizeMake(0, 3)];
  }
return self;
}
  • Now add #import <QuartzCore/QuartzCore.h> line to your MyView.m
  • Open TestAppAppDelegate.m and add #import "MyView.h" file
  • Now in application didFinishLaunching add folowing code
1
2
MyView *roundedView = [[[MyView alloc] initWithFrame:CGRectMake(100, 100, 100, 150)] autorelease];
[window addSubview:roundedView]; 
  • Save and run and you should have rounded black view on the main window, now add other subviews or modify by your will

Here is file ready for download.