How to decrease the size of Camera2D without using Zoom

I think setting the Camera2D's zoom is the only way to do this, but I could be wrong. I generally only focus on the 3D side of Godot for the most part, so maybe there is a way that I am unaware of :sweat_smile:

As far as I know, the blue part of the Camera2D is the size of the Viewport the Camera2D is a child of. If the Camera2D is not a child of a Viewport in the scene, then it takes the size of the root Viewport, whose size is the size of the window in the project settings.

@Dullahan said: I've been able to do this, but it's just giving Zoom, but this spoils the quality of the images I used and that's not what I want, I need to narrow down that area of ​​the blue Camera2D frame.

What do you mean by it "spoils the quality of the images"? Perhaps something in the import settings on your image, or the settings in the project, are causing the problem.

On the images, do you have filter disabled? In your project settings, do you have the stretch mode set to 2D or Viewport?

@Dullahan said:

@TwistedTwigleg said: As far as I know, the blue part of the Camera2D is the size of the Viewport the Camera2D is a child of. If the Camera2D is not a child of a Viewport in the scene, then it takes the size of the root Viewport, whose size is the size of the window in the project settings.

Where can I configure this Viewport in version 2.1.5?

Hey Dullahan! First, sorry about the delay, I meant to get back sooner.

You can find the size of the Viewport under the Window tab in the project settings. Here is a screen shot showing the settings for Viewport size and scaling:

@TwistedTwigleg said: What do you mean by it "spoils the quality of the images"? Perhaps something in the import settings on your image, or the >settings in the project, are causing the problem.

On the images, do you have filter disabled? In your project settings, do you have the stretch mode set to 2D or Viewport?

If I try to leave the camera closer by modifying the value from 1/1 to 0.5 / 0.5 where it would be the ideal size for which I need it, the images are blurry like in the example below.

With 1 by 1 zoom, the image is in its total quality

With 0.5 by 0.5 zoom, the image gets a bit blurry

And the first image has a wide field of view capable of seeing much of the map, while the second one has the small field of view, where is this way I'm trying to place.

However, I'm wanting to leave the first image with the field of view equal to the second image, but this without using the zoom and making the image lose quality

What you are seeing when zoomed in is not a loss of quality, but rather you can see the pixels in the image. This is because as you zoom in, the size of the pixels gets bigger, which makes them more noticeable. The reason it looks crisp and not blurry when the camera is not zoomed in is because the pixels in the image are at the same scale as the pixels in your monitor.

There are a few ways you could go about 'fixing' this (though actually it is not a bug or anything, it is just how graphics are rendered).

One way you can fix the blurry looking image is by redoing the art assets so they look better at lower resolutions. The sprite has several places were the pixels appear to be interpolated, which gives the illusion of being blurred. If you remove these interpolated pixels and replace them with sharp contrasting colors, it will look less blurry.

However, this really just changes the style of your sprites so they look better when zoomed in. Ultimately this is a design choice on how the game looks, and given you are working as a Intern, I would get permission from your employers before making a big art direction change like this.

Another way you can (potentially) fix the issue is by using higher resolution sprites and setting the Viewport scaling mode to Viewport instead of 2D.

What this will do is it will keep the same scale of the Viewport so it has the same size as in the project settings, but when scaled up (like say, turned full screen), it will scale not scale the pixel size. This means higher resolution sprites will be needed to make the project look nice and crisp, or otherwise you will get what you already have as far as blurry looking sprites are concerned.

Yet another way to get around this issue is to just scale up all of your assets so they are the same size as the zoomed in version. If your character is something like 48x48 pixels, but you want 2x the zoom, why not just scale (or make a new) image at 96x96 pixels?

Then it will look nice and crisp, will appear to have the same size as the zoomed in camera, and ultimately gets around the problem.

A final way you can get around the issue is simply by not. To be frank, I do not think the image looks terrible zoomed in, and while some tweaks could be make to the sprite to remove some of the interpolated pixels, even with them it does not look terrible.

Ultimately I wouldn't worry too much about how the art looks if you have other, potentially more pressing issues to worry about first (like writing the code that makes the game work, for example). You can always change the art later to something more like what would be in the finished product once you are farther along in the game development process.

and the settings that I found I leave this way, enabled or disabled continue the same way

Did you press the import button again after making the change? From what I remember, you have to hit the import button to apply the changes you make in the import settings for a asset.

@Dullahan said: @TwistedTwigleg Thank you very much for the help, what you have gone will help me a lot.

I confused a lot in this part of Viewport, I thought it was some option, is that I did not associate the name with the screen. :s :D

I can leave it the way I want by modifying the screen size, but it gets a little small, so I'll try to do as you say, redo the larger size drawings.

Looking back on it, I probably could have explained it better... Sorry about that :sweat_smile:

Did you press the import button again after making the change? From what I remember, you have to hit the import button to apply the changes you make in the import settings for a asset.

As I'm using version 2.1.5, I do not think this version has the ability to import again, if it has, then it is very different and in a different location than version 3.0.

Yeah, it may be that Godot version 2.1 does not have that functionality after all. It's been awhile since I have last used Godot 2.1. The last time I opened Godot 2.1 was probably months ago, and it was only to grab a screen shot.

@TwistedTwigleg

Would you know or would you have any video or tutorial how to do so that only the location around the character was displayed while the rest remained in the dark?

Example: As if the map had in the dark, and the character had a light, where it would only give to see the map around the character

I think if I could apply this effect, I could solve all the problems I'm having.

As for tutorials/videos, I do not know of any right off. I do plan on making a tutorial at some point in the future about how to make something similar (see below), but right now I am waiting on a bug fix.

The effect is certainly possible though, and there are several ways you could go about making such a effect:

The easiest way to get this effect is to make a texture the same size as your game. In the center of the texture you have completely transparent pixels where the player's light would be. Then around the center of the texture you make slightly transparent black pixels that fade into solid black pixels.

Then you just place this texture over everything, making sure the center of the texture lines up with the player's position. This method is cheap and easy, but has the huge downside of not looking the best. This method also assumes the player will always be in the center of the screen, which depending on your game, may or may not be feasible.

Another way is to use Godot's built in Light and Shadow system. See this QA post and check out the lights and shadows demo from the Godot demo repository (look under the version 2.1 branch).

This may or may not work for your game, but it is a option.

The third way is to use some shader magic. First you need to make a big black rectangle the same size as your game (or bigger).

Then you need to write a shader that discards pixels when drawing over a certain color. This will make it where the black in the texture is only drawn when pixels are not the passed in color. This puts some limitations and ultimately requires some interesting tricks to make it look seamless, but it would give the desired effect.

But there is a better way that extends on this idea.

Pass in a texture that is a bit mask and use that for detecting whether you should discard the pixel or not instead of checking the color underneath each pixel. Using a additional Viewport node, you place all completely white sprites in the same position as the lights in the scene. Then in the shader you check the imported bit mask and see whether there is white at that position or not. If there is white, then you discard the pixel, while if there is not then you draw the black pixel. Using a bit mask like this makes it where you can show/hide any colored background, giving you the illusion of a shadow system.

Personally i have used this method both ways, and it works great. The only downside is there is really no tutorials on the matter. I plan on changing that eventually by writing a tutorial about it on RandomMomentania, but I am waiting for a Godot engine bug to be fixed first (though I may eventually go ahead with the tutorial anyway and just work around the bug. Also, the tutorial I plan on writing will use Godot 3, so it may not be helpful in your case).

Depending on how much experience you have with writing shaders, this could be fairly easy. I struggled at first to get it working, but I had almost no experience with shaders at the time. Now I look at the shader and I can see it is pretty simple (all things considered).

The final way you could get around this is simply by using a method similar to that in the Fog of War demo in the demo repository,

You could p[lace a number of black sprites, and then when the player gets near them, make the black sprites invisible. Then when the player moves away, make them visible again. A simple trick, but sometimes that is all you need.

Ultimately I wouldn't worry too much about how the art looks if you have other, potentially more pressing issues to worry about first (like writing the code that makes the game work, for example). You can always change the art later to something more like what would be in the finished product once you are farther along in the game development process.

The game itself is simple and I've done almost 60% of the part of the code, just this part of the screen, to display the map only around the character that is making me difficult. :'(

And again, thank you very much I'm having a lot of difficulties mainly because of the version, there is not a high range of tutorials teaching in version 2.1.5.

Ah! Well it is good you have so much of the work finished, at least on the code side. As for helping, no problem! I am happy to help :smile:

As for tutorials in Godot 2.1: They are pretty sparse. Most of us using Godot 2.1 had to learn the hard way, and by the time we finally sort of knew what we were doing, Godot 3 came out and so the majority migrated to that, leaving fewer tutorials for those using Godot 2.1. Having come from a similar position, there was practically no tutorials for Godot at all when I started way back with Godot 2.0, I totally understand where you are coming from. Thankfully it gets easier the more you practice and try things, and Godot 2 knowledge converts nicely to Godot 3, so if/when you can use Godot 3 the transition should be fairly smooth :smile:

(Also, I imagine the majority of the Godot 3 tutorials can be back ported to Godot 2 with a little work. If you can only find Godot 3 solutions, I would try seeing if you can convert the solution to Godot 2 as another potential option. I am not sure how feasible it would be though...)