GPUImageUIElement overlay size

Question

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:

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!

Answer 1

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: