Draw only corners to ImageVIew frame

Question

I am trying to draw only corners to ImageView frame. For this I used CAShapeLayer and Bezier path and working fine with dotted lines around the UIImageView frame. But requirement is something more like, have to show only corners. Things which I tried till now is,

@property (strong, nonatomic)CAShapeLayer *border;

_border = [CAShapeLayer layer];
_border.strokeColor = [UIColor colorWithRed:67/255.0f green:37/255.0f blue:83/255.0f alpha:1].CGColor;
_border.fillColor = nil;
_border.lineDashPattern = @[@40, @50];
[pImageView.layer addSublayer:_border];
_border.path = [UIBezierPath bezierPathWithRect:pImageView.bounds].CGPath;
_border.frame = pImageView.bounds;

I used different lineDashPattern but unable to get the result as I didn't found proper documentation for lineDashPattern. How it draws and all. Any type of help will be useful

I want something like this

What is your purpose by this frame? if it is resize image then check https://github.com/yackle/CLImageEditor having good control for resize image — rohit Sidpara, Oct 18 '16 at 10:49

Ronak Chaniyara · Accepted Answer · 2016-10-18T13:24:00.110

Use below code, working for me:

    //1. For imageView Border
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.path =[UIBezierPath bezierPathWithRect:_imgView.bounds].CGPath;
    shapeLayer.strokeColor = [UIColor redColor].CGColor; //etc...
    shapeLayer.lineWidth = 2.0; //etc...
    shapeLayer.position = CGPointMake(0, 0); //etc...
    [_imgView.layer addSublayer:shapeLayer];


    //2. For Outside Corner

    float cWidth=30.0;

    float cSpace=_imgView.frame.size.width+20-(2*cWidth);

    NSNumber *cornerWidth=[NSNumber numberWithFloat:cWidth];
    NSNumber *cornerSpace=[NSNumber numberWithFloat:cSpace];

    CAShapeLayer *_border = [CAShapeLayer layer];

    _border.strokeColor = [UIColor blackColor].CGColor;

    _border.fillColor = nil;

    _border.lineWidth=2.0;

    //imageView frame is (width=240,height=240) and 30+200+30=260 -->10 pixel outside imageView
    _border.lineDashPattern = @[cornerWidth,cornerSpace,cornerWidth,@0,cornerWidth,cornerSpace,cornerWidth,@0,cornerWidth,cornerSpace,cornerWidth,@0,cornerWidth,cornerSpace,cornerWidth];

    _border.path = [UIBezierPath bezierPathWithRect:CGRectMake(-10, -10, _imgView.frame.size.width+20, _imgView.frame.size.height+20)].CGPath;

    [_imgView.layer addSublayer:_border];

Output:

This is working perfectly. But have one question.. What is cWidth ? — Saheb Singh, Oct 19 '16 at 06:37

Draw only corners to ImageVIew frame

1 Answers1