Understand how to use the root viewport to show a smaller area of the scene

Help
1

Godot Version

4.4.1

Question

Hey, hi!

I am learning Godot (my background is C++ and low level programming), and this is the situation.

2D project, i have a scene that is very big (think 300.000 x 300.000 “units”) where i draw some sprites inside, sparsely, and do some manual drawing too, mostly lines and circles.

I want my game screen to show a selected portion of the scene, and let the player pan&zoom using mouse (fingers, whatever, keyboard) around the scene. I am reading trough the documentation and it seems i need to play with the root viewport somehow? But i cannot find the best approach to it.

There is also an UI that should not be scaled/moved around on top of the scene…

currently i can draw my scene with what i need inside, but of course stuff gets our of sight pretty easily since screen size is like 1200x900 and scene size is so big. At the same time, i cannot “scale down” the scene because stuff would be… invisible…

What i am missing here?

2

Have you had a look at camera2d-node?

3

I am looking at it, but i am unsure on how to use it.

Do i need to place the camera inside the scene or do i need to use it as root scene?
My scene should be a child of the camera? And the UI controls should NOT be under the camera?

it’s not very clear to me

4

Depends on how your game is setup, but in general: your camera should be a child of the main scene. It will register to the global viewport, as you do not have created a separate one yourself.

Your HUD can be a CanvasLayer as child of the camera, or an additional CanvasLayer anywhere else. Everything having this CanvasLayer as parent will stay unaffected by the camera’s movement.

5

That would actually be a great addition to the “Getting Started” section of the docs. There is nothing about working with a camera so far :slight_smile:

There are though two (!) example projects linked in the Camera2D’s docs page.

1 Like
6

The platformer demo doesn’t help, as it uses camera only for split-screen which is not what i am looking for, the other one i am studying at the moment…

But yes, an addition to the docs would be great.

7

i cannot find where the isometric demo uses a camera2d either? what i am missing?

8

So the game screen is 1200 x 900, that is set in project setting.

About the rest of your question, you could do it this way:

root node
→ scene ( 3000k x 3000k )
→ camera2D
-------> UI

scene and camera2D are both child of root node. UI is child of camera2D.
The game screen displays what camera “sees”.
If you move camera, the UI will stay in place.

But if you “zoom” the camera, the UI will be scaled also,
So you need to scale UI to compensate.

9

why would i put the UI under the camera? Can i put the scene under the camera? Would this avoid the zoom issue with the camera and the UI?

10

Usually you would put the UI under a canvaslayer-node and attach the camera to your player. In your case you dont have a player i guess so just put it as a child of the root node

11

This approach works, i am now playing with pan & zoom via mouse, thank you all guys!

12

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