Crop right side of UIImage inside UIImageView with a PanGestureRecognizer - ios

Question

I am trying to "crop" an image inside an imageView. Crop in the sense of: If the user pans to the left, the picture gets cropped from the right side to the left. So, when the user pans to the right, the picture will be shown completely, if the user pans to the far left, the picture is not visible.
I tried the following:
#IBAction func handlePanGesture(recognizer: UIPanGestureRecognizer) {
let translation = recognizer.translationInView(containerView)
// Resize the image View
let image = imageView.image!
let hasAlpha = false
let scale: CGFloat = 0.0
let newRect = CGRectMake(0, 0, image.size.width - translation.x, image.size.height)
UIGraphicsBeginImageContextWithOptions(newRect.size, !hasAlpha, scale)
image.drawAtPoint(CGPointMake(-newRect.origin.x, -newRect.origin.y))
let croppedImage = UIGraphicsGetImageFromCurrentImageContext()
UIGraphicsEndImageContext()
imageView.image = croppedImage
recognizer.setTranslation(CGPointZero, inView: containerView)
}
This kind of works. See a gif here (at the moment this is just applied to the left image).
Can someone point me in the right direction? Why does the image height not stay the same, is that because the contentMode is set to 'Aspect Fit'? Why is it only resizing when you pan to the left? Here is a screenshot of the configuration of the imageView
Thanks for any tips.

Answer 1

I solved it to following way.
I will explain and post the code below. First, I resized the image to fit the imageView. That way I could set the contentMode to .Left. Second I kept two copies of the image. So, one picture can be cropped from right to left and one can be reversed when to user pans from left to right.
My cropping-function from above wouldn't work so I cropped them with CGImageCreateWithImageInRect(_:_:).
Here is the code for the UIPanGestureRecognizer which works for me:
#IBAction func handlePanGesture(recognizer: UIPanGestureRecognizer) {
let translation = recognizer.translationInView(containerView)
let imageLeft = googleImageView.image!
let imageRef = CGImageCreateCopy(initiallyScaledImage?.CGImage)
let imageRight = UIImage(CGImage: imageRef!, scale: (initiallyScaledImage?.scale)!, orientation: (initiallyScaledImage?.imageOrientation)!)
if translation.x < 0 {
let scale = imageLeft.scale
let newRect = CGRectMake(0, 0, (imageLeft.size.width + translation.x) * scale, imageLeft.size.height * scale)
let imageRef = CGImageCreateWithImageInRect(imageLeft.CGImage, newRect)
if let croppedImage = imageRef {
googleImageView.image = UIImage(CGImage: croppedImage, scale: scale, orientation: imageLeft.imageOrientation)
}
} else if translation.x > 0 {
// Get the rect from above, add translation, set new picture
let scale = imageRight.scale
let newRect = CGRectMake(0, 0, (imageLeft.size.width + translation.x) * scale, imageRight.size.height * scale)
let imageRef = CGImageCreateWithImageInRect(imageRight.CGImage, newRect)
if let uncroppedImage = imageRef {
googleImageView.image = UIImage(CGImage: uncroppedImage, scale: scale, orientation: imageRight.imageOrientation)
}
}
recognizer.setTranslation(CGPointZero, inView: containerView)
}