Search code examples
iosswiftgpuimageuielement

GPUImageUIElement overlay size


I'm trying to record a video with some overlay text using GPUImage library. Recording with overlay works so far, but I can't achieve the overlay to have proper size. No matter which frame I use by initialization, the overlay view is always take the whole size of a preview layer (GPUImageView). I tried to add the overlay both in storyboard and programmatically. Here is my code:

camera = GPUImageVideoCamera(sessionPreset: AVCaptureSessionPresetHigh, cameraPosition: AVCaptureDevicePosition.Back)
camera.outputImageOrientation = UIInterfaceOrientation.LandscapeRight
camera.horizontallyMirrorFrontFacingCamera = false
camera.horizontallyMirrorRearFacingCamera = false

filterView = self.view as! GPUImageView

filter = GPUImageBrightnessFilter()
blendFilter = GPUImageAlphaBlendFilter()
blendFilter.mix = 1.0

camera.addTarget(filter)

// here I try to add a label as UIElement
let label = UILabel(frame: CGRect(x: 10, y: 10, width: 100, height: 30))
label.text = "Demo text"
label.textColor = UIColor.redColor()
label.font = UIFont.systemFontOfSize(17.0)
label.backgroundColor = UIColor.clearColor()
view.addSubview(label) // for test purposes

uiElementInput = GPUImageUIElement(view: label)

filter.addTarget(blendFilter)
uiElementInput.addTarget(blendFilter)
blendFilter.addTarget(filterView)

filter.frameProcessingCompletionBlock = { filter, time in
  self.uiElementInput.update()
}

camera.startCameraCapture()

The result appears so: Screenshot

How can I get UIElement to have a smaller size like the label as part of view? The idea is to add a predefined overlay view (not just a label), but it has also wrong dimensions.

Thank you!


Solution

  • Hello Andrey Gershengoren,

    You should set the size of label view as same with camera capture session preset size.

    If you choose AVCaptureSessionPreset640x480, you should set label's size to (640, 480).

    I wrote the code for you.

    import UIKit
    import GPUImage
    
    class ViewController: UIViewController {
    
        @IBOutlet weak var filterView: GPUImageView!
        var videoCamera : GPUImageVideoCamera!
        var uiElement: GPUImageUIElement!
        var filter:GPUImageBrightnessFilter!
        var blendFilter: GPUImageAlphaBlendFilter!
        var uiElementInput: GPUImageUIElement!
    
        override func viewDidLoad() {
            super.viewDidLoad()
            videoCamera = GPUImageVideoCamera(
                sessionPreset: AVCaptureSessionPreset640x480,
                cameraPosition: AVCaptureDevicePosition.Back)
            videoCamera.outputImageOrientation = .Portrait
            videoCamera.horizontallyMirrorFrontFacingCamera = false
            videoCamera.horizontallyMirrorRearFacingCamera = false
    
            filter = GPUImageBrightnessFilter()
            blendFilter = GPUImageAlphaBlendFilter()
            blendFilter.mix = 1.0
    
            videoCamera.addTarget(filter)
    
            // here I try to add a label as UIElement
            let label = UILabel(frame: CGRect(x: 0, y: 0, width: 640, height: 480))
            label.text = "Demo text"
            label.textColor = UIColor.redColor()
            label.font = UIFont.systemFontOfSize(17.0)
            label.backgroundColor = UIColor.clearColor()
            label.textAlignment = .Center
    
            uiElementInput = GPUImageUIElement(view: label)
    
            filter.addTarget(blendFilter)
            uiElementInput.addTarget(blendFilter)
            blendFilter.addTarget(filterView)
    
            filter.frameProcessingCompletionBlock = { filter, time in
                self.uiElementInput.update()
            }
    
            videoCamera.startCameraCapture()
        }
    
        override func didReceiveMemoryWarning() {
            super.didReceiveMemoryWarning()
        }
    
    
    }
    

    The result is blow:

    enter image description here