How to display a cutout/portion of a video in AVFoundation

Question

I'm trying to crop a video / display a portion of a video in AVFoundation. So far my code looks right to me but the output is not what I wanted. I don't see what is wrong. Any ideas?

let item = AVPlayerItem(url: nextVideoItem.url)
let cropRect = CGRect(x: 200, y: 200, width: 300, height: 300)
let cropComposition = AVMutableVideoComposition(asset: item.asset, applyingCIFiltersWithHandler: { request in    
    let cropFilter = CIFilter(name: "CICrop")!
    cropFilter.setValue(request.sourceImage, forKey: kCIInputImageKey)
    cropFilter.setValue(CIVector(cgRect: cropRect), forKey: "inputRectangle")
    
    let imageAtOrigin = cropFilter.outputImage!.transformed(by: CGAffineTransform(translationX: -cropRect.origin.x, y: -cropRect.origin.y))
    request.finish(with: imageAtOrigin, context: nil)
})
cropComposition.renderSize = cropRect.size
item.videoComposition = cropComposition
self.player.replaceCurrentItem(with: item)
self.player.play()

_"output is not what I wanted"_. What were you expecting, and what was the actual output? — Abhinav Mathur, Dec 20 '22 at 16:33
@AbhinavMathur the desired output is in the title of my question. The actual output is just an empty screen. — Nico S., Dec 21 '22 at 18:10
Can you add a minimum reproducible example? It'll be better to see the entire logic/flow you're using — Abhinav Mathur, Dec 25 '22 at 18:38

score 1 · Accepted Answer · answered Dec 26 '22 at 17:04

The above code runs fine in itself, the reason you can't see it is you're probably not setting the frame of the AVPlayerViewController's view or AVPlayerLayer correctly in your surrounding UI code. Here is a Swift Playground code snippet that plays a video asset with the crop you specified above:

import UIKit
import AVKit
import PlaygroundSupport

class MyViewController : UIViewController {
    var player: AVPlayer!
    var avLayer: AVPlayerLayer!
    
    override func loadView() {
        let view = UIView()
        view.backgroundColor = .white

        player = AVPlayer()
        
        let item = AVPlayerItem(url: #fileLiteral(resourceName: "logos.mov"))
        
        let cropRect = CGRect(x: 500, y: 250, width: 480, height: 320)
        let cropComposition = AVMutableVideoComposition(asset: item.asset, applyingCIFiltersWithHandler: { request in
            let cropFilter = CIFilter(name: "CICrop")!
            cropFilter.setValue(request.sourceImage, forKey: kCIInputImageKey)
            cropFilter.setValue(CIVector(cgRect: cropRect), forKey: "inputRectangle")
            
            let imageAtOrigin = cropFilter.outputImage!.transformed(by: CGAffineTransform(translationX: -cropRect.origin.x, y: -cropRect.origin.y))
            request.finish(with: imageAtOrigin, context: nil)
        })
        cropComposition.renderSize = cropRect.size
        item.videoComposition = cropComposition
        self.player.replaceCurrentItem(with: item)
        self.player.play()
        
        avLayer = AVPlayerLayer()
        avLayer.player = self.player
        view.layer.addSublayer(avLayer)
        self.view = view
    }
    
    override func viewDidAppear(_ animated: Bool) {
        // this is the important bit
        avLayer.frame = view.bounds
    }
}
// Present the view controller in the Live View window
PlaygroundPage.current.liveView = MyViewController()

Thanks, I just tested it with my file. It appears that doesn't work with .mp4 files. I converted my file to .mov and now it works as well. — Nico S., Dec 31 '22 at 14:12

How to display a cutout/portion of a video in AVFoundation

1 Answers1