1

Trying to crop what is visible inside the cropView frame, always getting correct size but upper left corner of image as a result.

@objc func cropConfirmButtonTapped(){
    
    
    guard let imageToCrop = editImageView.image else {
        return
    }
    
    let cropRect = CGRect(x: cropView.frame.origin.x,
                          y: cropView.frame.origin.y,
                          width: cropView.frame.width,
                          height: cropView.frame.height)
    
    let croppedImage = cropImage(imageToCrop,
                                 toRect: cropRect,
                                 imageViewWidth: editImageView.frame.width,
                                 imageViewHeight: editImageView.frame.height)
    
    editImageView.image = croppedImage
    editImageScrollView.zoomScale = 1
    
    
}

As per https://developer.apple.com/documentation/coregraphics/cgimage/1454683-cropping

func cropImage(_ inputImage: UIImage, toRect cropRect: CGRect, imageViewWidth: CGFloat, imageViewHeight: CGFloat) -> UIImage?
{
    let imageViewScale = max(inputImage.size.width / imageViewWidth,
                             inputImage.size.height / imageViewHeight)
    
    // Scale cropRect to handle images larger than shown-on-screen size
    let cropZone = CGRect(x: cropRect.origin.x * imageViewScale,
                          y: cropRect.origin.y * imageViewScale,
                          width: cropRect.size.width * imageViewScale,
                          height: cropRect.size.height * imageViewScale)
    
    // Perform cropping in Core Graphics
    guard let cutImageRef: CGImage = inputImage.cgImage?.cropping(to: cropZone)
        else {
            return nil
    }
    
    // Return image to UIImage
    let croppedImage: UIImage = UIImage(cgImage: cutImageRef)
    return croppedImage
}

Setup of views:

    editImageScrollView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor).isActive = true
    editImageScrollView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
    editImageScrollView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
    editImageScrollView.bottomAnchor.constraint(equalTo: colourOptionsView.topAnchor).isActive = true
    
    editImageView.widthAnchor.constraint(equalTo: editImageScrollView.widthAnchor).isActive = true
    editImageView.heightAnchor.constraint(equalTo: editImageScrollView.heightAnchor).isActive = true
    editImageView.centerXAnchor.constraint(equalTo: editImageScrollView.centerXAnchor).isActive = true
    editImageView.centerYAnchor.constraint(equalTo: editImageScrollView.centerYAnchor).isActive = true
    
    cropView.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
    cropView.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
    cropView.widthAnchor.constraint(equalTo: view.widthAnchor, constant: -12).isActive = true
    cropView.heightAnchor.constraint(equalTo:view.widthAnchor, constant: -12).isActive = true

Tried it with different ratios: enter image description here

enter image description here

Stefan Ovomate
  • 511
  • 1
  • 4
  • 16
  • I see some suspicious things in your code, but am unsure whether this actually causes the behaviour you described. Can you show the image that you are trying to crop? The important information here is its aspect ratio, and also show the aspect ratio of `editImageView`. – Sweeper Aug 06 '22 at 12:47
  • I've uploaded the images I tried it with. Both ending up cropping the upper left corner of the image. – Stefan Ovomate Aug 06 '22 at 13:06

0 Answers0