Wednesday, June 5, 2013

UIBezierPath bezierPathWithOvalInRect example in Objective C (iOS).


UIBezierPath bezierPathWithOvalInRect

Creates and returns a new UIBezierPath object initialized with an oval path inscribed in the specified rectangle

+ (UIBezierPath *)bezierPathWithOvalInRect:(CGRect)rect

Parameters
rect
The rectangle in which to inscribe an oval.

Return Value
A new path object with the oval path.

Discussion of [UIBezierPath bezierPathWithOvalInRect]
This method creates a closed subpath that approximates the oval using a sequence of Bézier curves. The path is created in a clockwise direction (relative to the default coordinate system). If the rect parameter specifies a square, the inscribed path is a circle.

UIBezierPath bezierPathWithOvalInRect example.
//BezierPath
UIBezierPath *bezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0, 0, 100, 100)]; 

// Create an image context containing the original UIImage.
UIGraphicsBeginImageContext(_imgTemp.image.size);

// Clip to the bezier path and clear that portion of the image.
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextAddPath(context,bezierPath.CGPath);
CGContextClip(context);

// Draw here when the context is clipped
[_imgTemp.image drawAtPoint:CGPointZero];

// Build a new UIImage from the image context.
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
self._imgTemp.image = newImage;

Example of [UIBezierPath bezierPathWithOvalInRect].
You can draw it using either fill or stroke methods for example in custom view's drawInRect: implementation:

- (void)drawRect:(CGRect)rect {
    // Drawing code
    UIBezierPath *circle = [UIBezierPath
                    bezierPathWithOvalInRect:CGRectMake(75, 100, 200, 200)]; 
    [circle fill];
}

UIBezierPath bezierPathWithOvalInRect example.
- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    // create a yellow background
    UIView *bg = [[UIView alloc] initWithFrame:self.view.bounds];
    bg.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:bg];   

    // create the mask that will be applied to the layer on top of the
    // yellow background
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.fillRule = kCAFillRuleEvenOdd;
    maskLayer.frame = self.view.frame;

    // create the paths that define the mask
    UIBezierPath *maskLayerPath = [UIBezierPath bezierPath];
    [maskLayerPath appendPath:[UIBezierPath bezierPathWithRect:CGRectInset(self.view.bounds, 20, 20)]];
    // here you can play around with paths :)
//    [maskLayerPath appendPath:[UIBezierPath bezierPathWithOvalInRect:(CGRect){{80, 80}, {140, 190}}]];
    [maskLayerPath appendPath:[UIBezierPath bezierPathWithOvalInRect:(CGRect){{100, 100}, {100, 150}}]];
    maskLayer.path = maskLayerPath.CGPath;

    // create the layer on top of the yellow background
    CALayer *imageLayer = [CALayer layer];
    imageLayer.frame = self.view.layer.bounds;
    imageLayer.backgroundColor = [[UIColor blueColor] CGColor];

    // apply the mask to the layer
    imageLayer.mask = maskLayer;
    [self.view.layer addSublayer:imageLayer];

}

End of UIBezierPath bezierPathWithOvalInRect example article.