search

twilio / video-quickstart-ios

Twilio Video Quickstart for iOS
https://www.twilio.com/docs/api/video
MIT License
460 stars 178 forks source link

How to mirror UIStackView custom renderer [help wanted] #508

Closed ksuhr1 closed 4 years ago

ksuhr1 commented 4 years ago

Description

I am using the ExampleSampleBufferView from https://github.com/twilio/video-quickstart-ios/pull/286 in order to render the frames from the local camera instead of the remote frames as in the Twilio example project. All is working well as I have changed the previewView outlet from VideoView to a UIStackView, similar to how the ExampleSampleBufferView is rendering the remote frames. I am able to show the previewView frames but the frame is flipped. So if I put my hand on my right cheek of my face, in the preview it shows my hand on the left cheek of my face.

My question is how can I mirror the UIStackView? I notice in the example project, they keep the frames flipped when showing the remote frames. However I am using the custom renderer to render the local camera so I can do some openCV operations on it, so I don't want the frames flipped, I want it mirrored.

In the original code of the video-quickstart-ios I notice there is this piece of code which I assume is mirroring the frames. self.previewView.shouldMirror = (captureDevice.position == .front)

I get the error 'Value of type 'UIStackView' has no member 'shouldMirror''. I'm not sure how I can mirror the UIStackView frames as I can't find anything online about it that works. Any advice would be helpful! Thanks so much!

@IBOutlet weak var previewView: UIStackView! self.previewView.shouldMirror = (captureDevice.position == .front)

Versions

Xcode

[11.5]

iOS Version

[13.5.1]

iOS Device

[iPhone 8 11 Pro Max]

ceaglest commented 4 years ago

Hey @ksuhr1,

Since the PR isn't merged yet, its really up to you how to solve this problem. You could add a shouldMirror property to ExampleSampleBufferView and apply the CGAffineTransform that is needed to mirror.

I tried to have the ExampleSampleBufferView animate its own CGAffineTransform to handle rotation tags seen in local video and P2P remote video. There probably needs to be another layer of containment so that the view doesn't need to animate itself. I am thinking of a hierarchy like:

ExampleSampleBufferView
-----
    ExampleSampleBufferLayerView (Apply Transform for Rotation + Mirroring Here)
<------->
        AVSampleBufferDisplayLayer (layerClass backing)

Let me know if I can do any more to help.

Best, Chris

ceaglest commented 4 years ago

Hey @ksuhr1,

Just checking, were you able to mirror the ExampleSampleBufferView?

Best, Chris

ksuhr1 commented 4 years ago

Hi @ceaglest! Thank you for the help! I decided to use openCV functions to fix the mirroring because it was as simple as calling one function. Appreciate you checking in!

ceaglest commented 4 years ago

Great, I'll close this one out if you've got a solution for the mirroring.