kCIInputCenterKey对于应用于我的imageView内的图像的滤镜崩溃，该图像位于scrollView内

Question

Here is the function I'm trying to use to apply the CIBumpDistortion to an image loaded in my image view:

  @IBAction func filter(_ sender: Any) {

    guard let image = self.imageView.image?.cgImage else { return }



   // let offset = scrollView.contentOffset
    let openGLContext = EAGLContext(api: .openGLES3)
    let context = CIContext(eaglContext: openGLContext!)
    let ciImage = CIImage(cgImage: image)

    let filter = CIFilter(name: "CIBumpDistortion")

    filter?.setValue(ciImage, forKey: kCIInputImageKey)
    //filter?.setValue((x:0, y:0), forKey: kCIInputCenterKey)
    filter?.setValue(300.0, forKey: kCIInputRadiusKey)
    filter?.setValue(5.50, forKey: kCIInputScaleKey)


    if let output = filter?.value(forKey: kCIOutputImageKey) as? CIImage{
        self.imageView.image = UIImage(cgImage: context.createCGImage(output, from: output.extent)!)
    }


}

As of now the above sort of works with the CenterKey commented out. It defaults and applies the filter to the lower left corner of the image. If I uncomment it and try to put any values in there (even the default 150, 150) the app crashes with this error:

'NSInvalidArgumentException', reason: '-[_SwiftValue X]: unrecognized selector sent to instance 0x7ae52720'

the image inside the image view can be zoomed in/out or panned around inside the scroll view frame and saved in its new zoomed or panned state.

My goal is to have the filter always be applied in the center of the image view frame, regardless of how the image inside is zoomed in/out or panned.

for the center keys xy values I've tried numbers, variations of imageView.bounds.width / 2, imageView.bounds.height / 2 and I keep getting the same crash.

I would appreciate any tips or advice on getting my my center key figured out!

EDIT: I would think this would work for the x, y values of the center key but it still keeps the filter center at the origin of the image itself (lower left corner)

let frm: CGRect = imageView.frame

filter?.setValue((CIVector(x:frm.size.width * 0.5 , y:frm.size.height * 0.5)), forKey: kCIInputCenterKey)

EDIT2: Here's how my imageView and scrollview relate with each other, I started with the Scroll view in IB, set all of its constraints, then added the imageView programmatically like so:

imageView.frame = CGRect(x: 0, y: 0, width: scrollView.frame.size.width, height: scrollView.frame.size.height)
    imageView.isUserInteractionEnabled = true
    scrollView.addSubview(imageView)

this is my image picker controller function:

func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [String : Any]) {
    image = info[UIImagePickerControllerOriginalImage] as! UIImage

    scrollView.isHidden = false
    noImageHolder.isHidden = true
    imageView.image = image
    imageView.contentMode = UIViewContentMode.center
    imageView.frame = CGRect(x: 0, y: 0, width: image.size.width, height: image.size.height)

    scrollView.contentSize = image.size

    let scrollViewFrame = scrollView.frame
    let scaleWidth = scrollViewFrame.size.width / scrollView.contentSize.width
    let scaleHeight = scrollViewFrame.size.height / scrollView.contentSize.height
    let minScale = min(scaleHeight, scaleWidth)

    scrollView.minimumZoomScale = minScale / 2
    scrollView.maximumZoomScale = 5
    scrollView.zoomScale = minScale
}

And finally this function centers the contents of imageView inside the scrollview:

func centerScrollViewContents(){

    let boundsSize = scrollView.bounds.size
    var contentsFrame = imageView.frame

    if contentsFrame.size.width < boundsSize.width{
        contentsFrame.origin.x = (boundsSize.width - contentsFrame.size.width) / 2
    }else{
        contentsFrame.origin.x = 0
    }

    if contentsFrame.size.height < boundsSize.height{
        contentsFrame.origin.y = (boundsSize.height - contentsFrame.size.height) / 2
    }else{
        contentsFrame.origin.y = 0
    }

    imageView.frame = contentsFrame

}

Answer 1

According to the reference, you need to pass CIVector for kCIInputCenterKey .

k​CIInput​Center​Key

Try this:

filter?.setValue(CIVector(x:0, y:0), forKey: kCIInputCenterKey)

---

As I have noted in the first comment, you need to utilize some properties of UIScrollView , contentSize , contentOffset or zoomScale , to convert UIScrollView -based coordinates to content-based coordinates.

Generally, you just need to add contentOffset :

    let cx = scrollView.frame.width/2 + scrollView.contentOffset.x
    let cy = scrollView.frame.height/2 + scrollView.contentOffset.y

The coordinate (cx, cy) represents the center of the scrollView in the content-based coordinate system.

But, if you want a coordinate which works with CIFilter , you may need to convert this content-based coordinate to an image-based coordinate. Maybe simple scaling would work, but cannot be sure with your EDIT2 code.