How to draw UIBezierPath with image, to erase image

Question

Actually we are working on a paint application,

We did paint strokes using bezier path, paths array.. we almost complete the application,

But there are some performance issues to drayong paint strokes from PathsArray which is having alredy drawn Bezierpaths, like paint strokes getting slow after drawing some number of strokes,

So tho avoid this performance issue we used an temperary iamge view behind the sketchImage View,

We drawn recent one stroke on Top Sketch Image view and updated the bottom Temperary iamge view with the PathsArray,

it works fine and imrove performance, but there is an issue in Eraser..

While doing eraser the backGroun temperary iamge view updates only at the end of the stroke,

So we planned to erase the image when eraser selects, how to do this.. any other ways

-(void)updateTempararyBottomLayerImageView 
{
    TempararyBottomLayerImageView.frame = CGRectMake(TopLayerImageView.frame.origin.x, TopLayerImageView.frame.origin.y, TopLayerImageView.frame.size.width, TopLayerImageView.frame.size.height);

    UIGraphicsBeginImageContext(TempararyBottomLayerImageView.bounds.size);

    for ( NSDictionary *dict in pathsArray )
    {
        UIBezierPath *p = (UIBezierPath*)[dict objectForKey:@"path"];
        p.lineWidth = [[dict objectForKey:@"size"]floatValue];

        if ([[dict objectForKey:@"red"] floatValue] == 0) //When eraser selected
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
        }
        else
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeCopy);
            [[UIColor colorWithRed:[[dict objectForKey:@"red"]floatValue]
                             green:[[dict objectForKey:@"green"]floatValue]
                              blue:[[dict objectForKey:@"blue"]floatValue]
                             alpha:[[dict objectForKey:@"alpha"]floatValue]] setStroke];
        }
        [p stroke];
    }

    [[UIColor colorWithRed:red green:green blue:blue alpha:opacity] setStroke];

    if(isEraser) //When eraser selected, change color as clear
    {
        CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
    }
    else
    {
        CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeCopy);
    }

    if (!isTouchEnd)
        [bzierPath stroke];

    TempararyBottomLayerImageView.image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

}


- (void) updateDrawingBoard
{

    UIGraphicsBeginImageContext(TopLayerImageView.bounds.size);

    if (pathsArray.count > 0)
    {
        NSDictionary * dict = [pathsArray lastObject];

        UIBezierPath *p ;
        @try {
            p = (UIBezierPath*)[dict objectForKey:@"path"];
        }
        @catch (NSException *exception)
        {
            NSLog(@"xxxxxxxxxxxx");
            return;
        }


        p.lineWidth = [[dict objectForKey:@"size"]floatValue];

        if ([[dict objectForKey:@"red"] floatValue] == 0) //When eraser selected
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
        }
        else
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeCopy);
            [[UIColor colorWithRed:[[dict objectForKey:@"red"]floatValue]
                             green:[[dict objectForKey:@"green"]floatValue]
                              blue:[[dict objectForKey:@"blue"]floatValue]
                             alpha:[[dict objectForKey:@"alpha"]floatValue]] setStroke];
        }
        [p stroke];



        [[UIColor colorWithRed:red green:green blue:blue alpha:opacity] setStroke];

        if(isEraser) //When eraser selected, change color as clear
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeClear);
        }
        else
        {
            CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeCopy);
        }

        if (!isTouchEnd)
            [bzierPath stroke];

        self.TopLayerImageView.image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();

    }


}


# pragma =====UITouch delegates=====
//==============================================
- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    if( [[event touchesForView:self.TopLayerImageView] count] == 1)
    {
        CGPoint touchPoint = [[touches anyObject] locationInView:self.TopLayerImageView];

        bzierPath = [UIBezierPath bezierPath];
        bzierPath.lineCapStyle = kCGLineCapRound;
        bzierPath.lineJoinStyle = kCGLineJoinRound;
        bzierPath.lineWidth = brushSize;
        [bzierPath moveToPoint:touchPoint];
        isTouchEnd = NO;

        UIBezierPath *tempPath = bzierPath;
        NSMutableDictionary   *dict = [NSMutableDictionary dictionaryWithObjectsAndKeys:
                                       tempPath,@"path",
                                       [NSNumber numberWithFloat:red], @"red",
                                       [NSNumber numberWithFloat:green], @"green",
                                       [NSNumber numberWithFloat:blue], @"blue",
                                       [NSNumber numberWithFloat:opacity], @"alpha",
                                       [NSNumber numberWithFloat:brushSize], @"size", nil];
        if (isEraser)
        {
            dict = [NSMutableDictionary dictionaryWithObjectsAndKeys:
                    tempPath,@"path",
                    [NSNumber numberWithFloat:0], @"red",
                    [NSNumber numberWithFloat:0], @"green",
                    [NSNumber numberWithFloat:0], @"blue",
                    [NSNumber numberWithFloat:0], @"alpha",
                    [NSNumber numberWithFloat:brushSize], @"size", nil];
        }
        [pathsArray addObject:dict];

        [self updateDrawingBoard];
    }

    //To hide bottom scroll wheel where ever tap in view
    UITouch *touch = [[event allTouches] anyObject];
    if ([touch view] != bottomScrollWheel)
    {
        [self minimizeScrollWheel];
    }
}

- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    if( [[event touchesForView:self.TopLayerImageView] count] == 1)
    {
        CGPoint touchPoint = [[touches anyObject] locationInView:self.TopLayerImageView];


        [bzierPath addLineToPoint:touchPoint];
        [bzierPath moveToPoint:touchPoint];

        isTouchEnd = NO;

        [self updateDrawingBoard];
    }
}

- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    if( [[event touchesForView:self.TopLayerImageView] count] == 1)
    {


        //  NSLog(@"**********************bzierPath == \r\n %@",bzierPath);

        CGPoint touchPoint = [[touches anyObject] locationInView:self.TopLayerImageView];
        [bzierPath moveToPoint:touchPoint];

        [bzierPath addLineToPoint:touchPoint];

        //bzierPath = nil;
        isTouchEnd = YES;
        [self updateDrawingBoard];
        [self updateTempararyBottomLayerImageView];

        if (TopLayerImageView.image != nil)
        {
            [undoArray addObject:TempararyBottomLayerImageView.image];
            [redoArray removeAllObjects];
            [redoPathsArray removeAllObjects];
        }


          self.TopLayerImageView.image = nil;
        [self EnableDisableUndoRedo];
    }
}


# pragma mark =====Settings =====
//==============================
// Slider Position can be changed from left to right or right to left
-(void)sliderPositionChange
{
    if (settingsPopoverVC.index == 0)
    {
        if (iOS7)
            [sliderView setFrame:CGRectMake(19, 128, 100, 357)];
        else
            [sliderView setFrame:CGRectMake(19, 108, 100, 357)];
    }
    else if(settingsPopoverVC.index == 1)
    {
        if (iOS7)
            [sliderView setFrame:CGRectMake(900, 128, 100, 357)];
        else
            [sliderView setFrame:CGRectMake(900, 108, 100, 357)];

    }
}

Answer 1

This below links are you to get understand

stack over flow - setneedslayout

SetNeedDisplay

Thanks