FullScreenLayer video; dynamically change the aspect ratio

Hello Everyone!

I’ve been experimenting with video texture to have the ability to be full screen using the FullScreenLayer I was able to do this but there is some weird issues with the aspect ratio. I cannot seem to get the ratio of the video when I enable it in fullscreen.

I’ve made a sample playground to demonstrate but will it be possible to dynamically change/have the aspect ratio of the video? Example: lf you have a portrait video, it will not try to stretch itself.

Thanks!

The fullscreen layer just displays whatever it has been given in the full available space, it doesn’t know the aspect ratio of the texture it’s using. But you could change the texture itself, you can scale, offset and clamp the video to achieve the proper aspect ratio: Aspect Ratio Question | Babylon.js Playground (babylonjs-playground.com)

And it’s possible to change these values dynamically to account for the difference between the aspect ratio of the canvas with the aspect ratio of the screen.

1 Like

I was also thinking of just using the video element of the texture and see if I can hit the api requestFullscreen() but it seems that I kept getting denied for it.

requestFullScreen needs to be called on a user interaction like a button click.

Was doing a side project. Here is one way to do it: https://playground.babylonjs.com/#9QAX0T#3

2 Likes