CODEWITHSUNDEEP
iosswiftgpuimagecore-image
mownier
mownier

Reputation: 1779

Creating a mask with edge detection by selecting part of an image

The story is that, the user selects a part of an image by drawing lines or curves. Based on the selection, a mask will be created using an edge detector.

How can i achieve this?
Are CoreImage and GPUImage could help to make this possible?
Is edge detection enough to make a mask?

I don't have any advanced knowledge on image processing and manipulation. I am just a starter trying to understand and learn it. By the way, this should be done in iOS.

Just like this one (the masking part).

Upvotes: 1

Views: 786

Answers (1)

Alanc Liu
Alanc Liu

Reputation: 1294

I wrote a sample for you to show you how to use mask to select part of image, if you want to implement more complex effect, you just need to change the path, then you can get any shape you want.

@interface MainViewController ()

@property UIImageView* imageV;
@property UIView* selectView;
@property UIView *blockView;
@property CGPoint startPoint;
@property CGPoint endPoint;

@end

@implementation MainViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.

    UIBarButtonItem *recoverItem = [[UIBarButtonItem alloc] initWithTitle:@"Recover" style:UIBarButtonItemStyleDone target:self action:@selector(recover)];
    [self.navigationItem setLeftBarButtonItem:recoverItem];

    _imageV = [[UIImageView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    _imageV.image = [UIImage imageNamed:@"test"];
    [self.view addSubview:_imageV];

    _blockView = [[UIView alloc] init];
    _blockView.frame = _imageV.bounds;
    _blockView.backgroundColor = [UIColor whiteColor];
    [_imageV addSubview:_blockView];
    _blockView.hidden = true;

    _selectView = [[UIView alloc] init];
    _selectView.layer.borderColor = [UIColor greenColor].CGColor;
    _selectView.layer.borderWidth = 2;
    [_imageV addSubview:_selectView];
    _selectView.hidden = true;

    UIPanGestureRecognizer *panGR = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
    [self.view addGestureRecognizer:panGR];
}

- (void) handlePan: (UIPanGestureRecognizer *)pan{
    if (UIGestureRecognizerStateBegan == pan.state) {
        _startPoint = [pan locationInView:_imageV];
    }
    else if (UIGestureRecognizerStateChanged == pan.state) {
        _selectView.hidden = false;
        CGPoint currentP = [pan locationInView:_imageV];
        float rectWidth = currentP.x - _startPoint.x;
        float rectHeight = currentP.y - _startPoint.y;
        _selectView.frame = CGRectMake(_startPoint.x, _startPoint.y, rectWidth,rectHeight);
    }
    else if (UIGestureRecognizerStateEnded == pan.state) {
        _endPoint = [pan locationInView:_imageV];
        float rectWidth = _endPoint.x - _startPoint.x;
        float rectHeight = _endPoint.y - _startPoint.y;
        //create path
        UIBezierPath *maskPath = [UIBezierPath bezierPathWithRect:[UIScreen mainScreen].bounds];
        UIBezierPath *otherPath = [[UIBezierPath bezierPathWithRect:CGRectMake(_startPoint.x, _startPoint.y, rectWidth,rectHeight)] bezierPathByReversingPath];
        [maskPath appendPath:otherPath];
        //set mask
        CAShapeLayer *maskLayer = [CAShapeLayer layer];
        maskLayer.path = maskPath.CGPath;
        [_blockView.layer setMask:maskLayer];
        _blockView.hidden = false;

        _selectView.hidden = true;
    }
}

-(void) recover{
    _blockView.hidden = true;
}

@end

Hope it can help you.

Upvotes: 1

Related Questions