Search code examples
ioscore-graphicscore-image

How to blend image with mask like WWDC segmentation under iOS 13?


The link is https://developer.apple.com/videos/play/wwdc2021/10040/ and time is 12:20.

I have reached this on iOS 13

func blendImages(
      background: CIImage,
      mask: CIImage,
      isRedMask: Bool = true
    ) -> CIImage? {

        print("blendImages")
        print(foreground.extent.size)
        print(mask.extent.size)
      // scale mask
      let maskScaleX = foreground.extent.width / mask.extent.width
      let maskScaleY = foreground.extent.height / mask.extent.height
      let maskScaled = mask.transformed(by: __CGAffineTransformMake(maskScaleX, 0, 0, maskScaleY, 0, 0))



      let blendFilter = isRedMask ? CIFilter.blendWithRedMask() : CIFilter.blendWithMask()
      blendFilter.inputImage = foreground
      blendFilter.maskImage = maskScaled

      return blendFilter.outputImage
    }

foreground:

1

mask(same ratio but not same size with foreground):

2

result(The imageView bgcolor is blue):

3

But how can I make this under iOS 13?

Thanks


Solution

  • To support iOS 12 and earlier, you can try this:

    if let blendFilter = CIFilter(name: "CIBlendWithMask") {                
            blendFilter.setValue(foreground, forKey: kCIInputImageKey)
            blendFilter.setValue(background, forKey: kCIInputBackgroundImageKey)
            blendFilter.setValue(maskScaled, forKey: kCIInputMaskImageKey)
                            
            return blendFilter.outputImage
    }
    

    You can instantiate Core Image filters by name. You can check the documentation below for an overview of filters.

    https://developer.apple.com/library/archive/documentation/GraphicsImaging/Reference/CoreImageFilterReference/index.html