3

I just want to change the shape of view from Square to Round. As i try with cornerRadious, But it just round the corner only. As I want to make whole view as a round shape.

DD_
  • 7,230
  • 11
  • 38
  • 59
Nirmalsinh Rathod
  • 5,079
  • 4
  • 26
  • 56
  • What do you mean by that if not the corners? –  May 10 '13 at 05:27
  • possible duplicate [How to make a circular UIView](http://stackoverflow.com/questions/1878595/how-to-make-a-circular-uiview) – DD_ May 10 '13 at 05:28
  • As, if we get any view or imageview than, buy default its in Square shape. So how can we make it as round shape without corner radious ? As if size of view is very high then its not actuly round shape with corner radious. So I just want to redraw the view and make it round shape. – Nirmalsinh Rathod May 10 '13 at 05:34

3 Answers3

6

A UIView is always rectangular. However, you can make it look round (or any shape at all, actually) with a mask. To do so, make a UIImage which is a black circle (in a transparent background). Now take the CGImage of that UIImage and make it the contents of a CALayer. Finally, set that CALayer as the mask of the layer of your view.

Let us suppose that your view is 100 x 100. Then (not tested, but should be pretty much right):

UIGraphicsBeginImageContextWithOptions(CGSizeMake(100,100), NO, 0);
CGContextRef c = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(c, [UIColor blackColor].CGColor);
CGContextFillEllipseInRect(c, CGRectMake(0,0,100,100));
UIImage* maskim = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

CALayer* mask = [CALayer new];
mask.frame = CGRectMake(0,0,100,100);
mask.contents = (id)maskim.CGImage;

view.layer.mask = mask;
matt
  • 515,959
  • 87
  • 875
  • 1,141
  • Is there a way to do this (i.e., mask a UIView so it appears circular) in Storyboard, or does it have to be done programmatically? – Crashalot Dec 11 '15 at 02:43
2

You can make rounded border with width of border of any control in this way:-

CALayer * l1 = [viewPopup layer];
[l1 setMasksToBounds:YES];
[l1 setCornerRadius:5.0];

// You can even add a border
[l1 setBorderWidth:5.0];
[l1 setBorderColor:[[UIColor darkGrayColor] CGColor]];


Just replace viewPopup with your control.

Note:- Don't forget to import <QuartzCore/QuartzCore.h>

Piyush Dubey
  • 2,416
  • 1
  • 24
  • 39
1

Try this code :- 

[roundView.layer setCornerRadius:50.0f];
[roundView.layer setBorderColor:[UIColor lightGrayColor].CGColor];
[roundView.layer setBorderWidth:1.5f];
[roundView.layer setShadowColor:[UIColor blackColor].CGColor];
[roundView.layer setShadowOpacity:0.8];
[roundView.layer setShadowRadius:3.0];
[roundView.layer setShadowOffset:CGSizeMake(2.0, 2.0)];

Note:- roundView is your view that you want to round.

I hope it helps you. Thanks

chandan
  • 2,453
  • 23
  • 31