GLView's createCameraTextureAsync does not follow Camera settings

I have been trying to use GLView’s createCameraTextureAsync to show a live preview of the camera feed using some shaders, but I realised that the preview does not follow the camera settings, despite being linked to it with a ref.

  1. The camera view is set at a ratio of 4:3, but the corresponding cameraTexture is at a ratio of 16:9. When the GLView container is constrained to a 4:3 size, the image is compressed.
  2. Also, when flipping cameras (to the front camera), the texture itself is reversed (but this can be adjusted with a shader anyway).

Here is an example snack, where I have overlapped two camera previews with the same dimensions (one with Camera, and another one with GLView), one of which being transparent: they should perfectly align. (They don’t.)

One last question, is there any way to disable the camera preview? When using both the Camera and the GLView, I have the impression that they are running simultaneously, which seems wasteful.

Hi @ksesong - thanks for the question. I’ve asked one of our resident GL experts to take a look at this, and he should get back to you soon!

Hi @ksesong,
I assume you’re talking about iOS platform, right?
Camera component on iOS doesn’t support setting its ratio, it’s always 4:3 for photos and 16:9 for videos and also photos that are taken during video recording.
GLView integration with Camera works more like video recording, so it’s always with 16:9 ratio. However, you can achieve 4:3 ratio by cropping the texture in the shader. It means that you need to take care on how you render that texture to maintain aspect ratio.
The only problem I see is that there is no way to get the texture size in JS. WebGL doesn’t implement this thing, but maybe we can find another solution. Let me know if you’d need it :slight_smile:

In terms of disabling camera preview, unfortunately it’s not possible yet, but we’re going to implement this soon :slight_smile:

I hope this will help you :slight_smile:

Yes, this is what I have ended up doing (adding another shader to crop/align the texture the right way). Thanks!

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.