2

I want to create a crop feature in swift. It will display one giant image view with the image to be cropped. Then on top of it another image view with a solid boarder and transparent background which is roughly 1/3 of the giant image view.

The user will be allowed to drag that overlay image view around and portion it on the part of the giant image view they want to crop.

Then when the click crop button I want to grab only the portion of the underlying giant image view that the overlay image view is covering. I'm not quite sure how to do that.

Here is what I've tried so far and all it does it crop the top portion of the giant image view to the bounds of the over lay image view. But how can I change it so that it does the crop with the proper bounds as it already does, but with the correct portion of the giant image view. Right now it only crops the top portion of it for some reason.

  @IBOutlet weak var overlayImage: UIImageView!
@IBOutlet weak var imageView: UIImageView!
var lastLocation = CGPoint()


override func viewDidLoad() {
    super.viewDidLoad()
    //drawCustomImage simply creates a transparent background and dashed bordered box to display on the top 1/3 of the giant image view
    let image = drawCustomImage()
    overlayImage.image = image
}


override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) {
    if let touch = touches.first{
        self.lastLocation = touch.locationInView(self.view)
    }
}


override func touchesMoved(touches: Set<UITouch>, withEvent event: UIEvent?) {
    if let touch = touches.first{
        let location = touch.locationInView(self.view)
        //don't let the user move the overlay image view passed the bounds of the giant image view
        if(((location.y - self.lastLocation.y) + self.overlayImage.center.y) < (self.imageView.frame.maxY - (self.overlayImage.frame.height / 3)) && ((location.y - self.lastLocation.y) + self.overlayImage.center.y) > (self.imageView.frame.minY) + (self.overlayImage.frame.height / 3)){

            self.overlayImage.center = CGPoint(x: self.overlayImage.center.x, y: (location.y - self.lastLocation.y) + self.overlayImage.center.y)
        }
    }
}


@IBAction func cropBtn(sender: AnyObject) {
    let imageRef: CGImageRef = CGImageCreateWithImageInRect(imageView.image!.CGImage, overlayImage.bounds)!
    imageView.bounds = overlayImage.bounds
    imageView.image = UIImage(CGImage: imageRef)
    overlayImage.hidden = true
}
mocode9
  • 229
  • 3
  • 16
  • There are much better (performance, code maintainability, memory) ways to do this. Consider (1) using CALayers - even CAShapeLayers for masking the underlying image and resizing, (2) a CoreGraphics context for drawing, and even (3) CIPerspectiveCorrection for cropping. Organize things in a UIImageView subclass and you could do this in a single view. –  Dec 08 '16 at 23:24
  • I would love to see an example if you can find one or have time to write one up. I'm not really familiar with core graphics so this is all pretty new to me. – mocode9 Dec 08 '16 at 23:47

0 Answers0