I want to apply google translate app brush effect on my image OCR

Question

Hi I bulid a text OCR iOS app using swift. I used the tesseract OCR Engine for that and it accuracy is pretty low. I want to select text area like on google translate brush effect on it please help me how to apply it?

Answer 1

I've managed to get this effect by adding another UIImageView (will be called drawingImageView for clarity) on top of the UIImageView which displays the image with text. The idea is to first display a completely black image with something like 0.3 alpha in the drawingImageView and then when you draw the line use .destinationOut as the context's blend mode. The code could look something like this:

override func viewDidLoad() {
    super.viewDidLoad()
    drawBlackBackground()
}

func drawBlackBackground() {
    UIGraphicsBeginImageContext(drawingImageView.frame.size)
    UIGraphicsGetCurrentContext()
    let image = UIImage(named: "black")
    image?.draw(in: drawingImageView.frame)
    self.drawingImageView.image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
}

func drawLineFrom(fromPoint: CGPoint, toPoint: CGPoint) {
    UIGraphicsBeginImageContext(drawingImageView.frame.size)
    let context = UIGraphicsGetCurrentContext()
    drawingImageView.image?.draw(in: drawingImageView.frame)
    context?.move(to: fromPoint)
    context?.addLine(to: toPoint)
    context?.setLineCap(.round)
    context?.setLineWidth(20)
    context?.setStrokeColor(red: 0, green: 1, blue: 0, alpha: 1)
    context?.setBlendMode(.destinationOut)
    context?.strokePath()
    self.drawingImageView.image = UIGraphicsGetImageFromCurrentImageContext()
    UIGraphicsEndImageContext()
}

You can check out this post for more information on drawing in swift and this one for a more advanced version. Also here you can find more information on blend modes.