Letterboxing in HDRP without 2nd camera

Hi,

in my app the user can switch between different camera-ratios (4/3, 21/9, ...).
This means that I get black bars left+right or top+down.

It´s easy to do this by having a second camera that renders only black and have this camera output at a lower depth.

The problem is that this second camera costs a little performance (~5 frames) and I would like to avoid this.

So what are the alternatives and which one is the "cheapest"?

Thanks!

 

You can use a RenderTexture to render the camera to the canvas and adjust the aspect ratio from there, however I am not sure about the performance difference.

 

I'd recommend trying the viewport rect on the camera e.g. x=0.1, w=0.8 => 10% black bars on sides. Might need to render a full screen black color once if the edges look odd on device.

 

How to do that efficiently? (It should be done each frame to clear background or UI.)

 

I’d probably only render the full screen once on startup and maybe in OnApplicationFocus(). It shouldn’t be required every frame. Rending once in full screen might not even be required anymore (was required in the past). Normally I’d use the viewport rect for something like a split screen game or a rearview mirror in a racing game. If anything, the performance should improve with letterboxing as the camera isn’t rendering the full screen area.

 

Yes, correct.
The problem is, that my GUI-areas that are outside of the camera rect have to be cleared each frame, too.
So what I do is to setup the right camera rect and accordingly scale four black images that surround it.
Sounds weird but the only solution I see.

 

Unless there's a method to clear the screen independently of cameras (I'm not aware of one, but haven't had reason to look) explicitly stating which areas you want to be drawn black by putting black UI elements on them sounds reasonable to me.

 

Just thought I'd mention that the GUI will match the camera render rect when the canvas render mode is set to "screen space - camera". The following GUI has two buttons attached to the top left and bottom right corners.

Screen space - overlay. Goes outside the letterbox.


Screen space - camera. Matches the letterbox.


I found the screen space camera useful when I was making a split screen test.


Should be ok to add the border images like you mentioned but it would probably still be worth setting the camera render rect to avoid rendering pixels behind the black images.

 

I tried calling GL.Clear() once the letterbox-ratio changes and this works.

Code (CSharp):

1.     IEnumerator Clear()
2.     {
3.         yield return new WaitForEndOfFrame();
4.         GL.Clear(true, true, Color.black);
5.     }

But don´t know what it costs to call this each frame for the case of having a GUI outside the camera-rect.