CanvasLayer size

Question

I am having difficulty using/understanding CanvasLayer.

Basically it seems CanvasLayer does not match the Viewport size because controls I add in the editor at the bottom do not show up in the viewport. I see the outline of the CanvasLayer in the editor but it is 1/2 the size of the scene window.

So what I did, was in code scale the CanvasLayer scale by 0.5. Now that is weird and counterintuitive seems to work but feels like a hack. It also changes the transforms x and y to 0.5.

var cvl=get_node("../CanvasLayer")
cvl.scale=cvl.scale*0.5

So all the controls at the bottom of the display do show up correctly.

So my question is. In the editor, how can I match the display size to the CanvasLayer?

Answer 1

A CanvasLayer doesn't have a size. It's a drawing layer, most commonly used to ensure that UI is drawn above game objects. You can't "see the outline of the CanvasLayer" because it doesn't have one. Setting its scale just scales everything that's drawn on that layer.

The viewport has a size. You should scale/position elements in the viewport to fit in the viewport.

Comments

Ok, my bad, I neglected to mention the camera. So I reduced down to the camera scaled twice the size. But the CanvasLayer follows the size of the display 1200x600 in my case.

So actually I was placing controls outside the viewport not realizing the purple box is the camera and does not capture CanvasLayer controls.

So the question is. Which is the viewport size? The size of the camera or the size of the display?