I'm currently making a game using the Libgdx library, and have currently hit a small hurdle.
I've disabled the ability to resize currently, in my Main.java class in the desktop project.
LwjglApplicationConfiguration cfg = new LwjglApplicationConfiguration();
cfg.resizable = false;
I'm wondering whether there is a simple way to make the window resize whilst keeping the aspect ratio. (Like when you shift+resize)
What are my options? :)
that function does not give you the ability to keep the aspect ratio or even something of that what you think. It does just disables the possebilty to resize the screen at the desktop application.
Please take a look at the libGDX wiki especialy the Scene2D page.
Take a look at the Viewport stuff from the Stage. It's explained how you do keep the aspect ratio with the current libGDX. There are tutorials out there who do explain a different way with the help of a virtual resolution and the screen resize method. It's outdate!
from the wiki
This example also uses a fixed stage size with "black bars" on either
side, this time using glViewport. First the stage size of 800x480 is
scaled to fit the screen size using the Scaling class. The result is
used to configure glViewport, which changes which part of the screen
OpenGL will use. Lastly, setViewport is passed the viewport position
and size. The result is the same as the last example, the stage has
"black bars" as necessary to keep the aspect ratio, but no drawing can
occur outside the viewport.
public void resize (int width, int height) {
Vector2 size = Scaling.fit.apply(800, 480, width, height);
int viewportX = (int)(width - size.x) / 2;
int viewportY = (int)(height - size.y) / 2;
int viewportWidth = (int)size.x;
int viewportHeight = (int)size.y;
Gdx.gl.glViewport(viewportX, viewportY, viewportWidth, viewportHeight);
stage.setViewport(800, 480, true, viewportX, viewportY, viewportWidth, viewportHeight);
}
regards
Related
Right now, I'm trying to code something that makes it where when the window is resized with the mouse, it will stay at a 16:9 aspect ratio. I'd like to have the code for this inside of my desktop launcher (I'm only compiling to desktop) but I'm also ok with doing it in my game file with public void resize() if I have to. I'm using Libgdx 3 so I can't use stuff like cfg.height but I'm curious if I can do it using config.setWindowSizeLimits() and just change the boundaries when necessary. If I'm missing something and there actually is a way to get the window's dimensions inside of desktop launcher that would be very good to know.
You can use a FitViewport. This will not fix the ratio of the window itself, but it keeps the aspect ratio by scaling the world up to fit the screen, adding black bars (letterboxing) for the remaining space.
You can use it like this:
public void initializeCameraAndViewport() {
camera = new OrthographicCamera();
viewport = new FitViewport(SCENE_WIDTH, SCENE_HEIGHT, camera);
}
#Override
public void resize(int width, int height) {
viewport.update(width, height);
}
It will make the screen look like this:
See the libgdx wiki for a more detailed description of viewports.
Using the Libgdx Framework, I'm generating an Actor from an Assets.java class and then drawing him depending on the state he is currently in. The problem i'm having is that he's coming out ridiculously small. I'm noticing that when I split the Texture into regions the .Split() function doesn't provide width and height parameters in comparison to a singular declaration of the texture region function here: new TextureRegion(Texture, x, y, width, height);
Note: I've also set the size of the world, the actor size etc they don't need to change how small he is. I'm assuming it's something to do with the sprite size or assets class. But the way i'm slicing the Texture works perfectly for the engine i've created.
I'm wondering is there something I'm missing or something to add to define the width/height of the TextureRegions inside theAssets.java code snippet?
All my sprites are in a 512x512 Texture with a height and width of 85px
Relevant Code:
rubenSprite = loadTexture("data/rubenSprite.png");
rubenFrames = TextureRegion.split(rubenSprite, 85, 85);
WalkF1 = rubenFrames[0][0];
WalkF2 = rubenFrames[0][1];
WalkF3 = rubenFrames[0][2];
WalkF4 = rubenFrames[0][3];
WalkF5 = rubenFrames[0][4];
... More TextureRegions
If more code is needed, or anything elaborated let me know. Thanks.
The size of actor is not size of texture inside. Actor has boundaries. When this boundaries are too low image cannot fit inside. On to the contrary, it is analogously.
You should set your actor as:
setWidth(width);
setHeight(height);
setBounds(left, right, width, height);
And make sure, that texture is also set to width and height.
btw.
I recommend, use drawables with Actors. It is more clearer. You create skin, where you define all your moves and then you call your textures from the skin.
Does it matter what height and width I use for my game? In my game I have a few polygons, they all are connected to images that I have painted, but when I have width and height as 800x480 I have to paint the images very small, this causes them to get blurry. Also, I don't really understand how this behaves on different sized phone screens.., does the images I have painted get streched, or do they stay small, even on big tablets? So my question is basically what is the optimal width and height to have on a libgdx game?
This is a part of my code, to maybe help you understand what I mean
WIDTH = Gdx.graphics.getWidth();
HEIGHT = Gdx.graphics.getHeight();
camera = new OrthographicCamera();
camera.setToOrtho(false, 800, 480 );
What will happen if I change these values? What would it be best to change them to?
I was reading on a tutorial of sorts, but they didn't really talk about this part.
Do I have to do something complicated to get my painted images to look decent on all devices?
EDIT:
This is how I currently implement a cloud into my game:
public class AnotherScreen implements Screen{
Polygon cloudPoly;
Texture cloud;
#Override
public void render(float delta) {
batch.setProjectionMatrix(camera.combined);
batch.begin();
renderBackground();
batch.draw(cloud,cloudPoly.getX(),cloudPoly.getY());
batch.end();
}
#Override
public void show() {
cloud = new Texture(Gdx.files.internal("assets/textures/cloud.png"));
cloudPoly = new Polygon();
cloudPoly.setPosition(MathUtils.random(350,600),MathUtils.random(380,440));
// theses vertices are just a little square atm
float[] cloudVertices = new float[] {
0,0,
0,20,
20,20,
20,0
};
cloudPoly.setVertices(cloudVertices);
}
}
The cloud image has width 256p and height 128p, when I set 'camera.setToOrtho(false, 800, 480 );' won't this cloud always stay in proportion?
I am sorry if I am unclear, I am a new programmer and my english could be better, love you doh for staying with me!
does the images I have painted get streched, or do they stay small, even on big tablets?
One of the greatest features of libgdx is that it lets you do things exactly as you want them. So, it is really your choice. With this snippet
WIDTH = Gdx.graphics.getWidth();
HEIGHT = Gdx.graphics.getHeight();
camera = new OrthographicCamera();
camera.setToOrtho(false, WIDTH, HEIGHT);
You would have a different viewport size in every different screen size. So your images would stay small.
In the other hand, if you use predefined values for the viewport like:
WIDTH = 800;
HEIGHT = 480;
camera = new OrthographicCamera();
camera.setToOrtho(false, WIDTH, HEIGHT);
You would get the same viewport for every screen and the images would stretch to occupy the same space in each axis. This won't necessarily be the same for each axis. So a perfect square image in one screen may look like a rectangle in another screen with a different x-y ratio.
There is a third option, you can fix one side and let the other be calculated, so you keep the ratio of your images (a square stays as square). You must decide what will be the fixed side. For a game like Super Mario Bros I would recommend you to fix the height and calculate the width:
HEIGHT = 480;
WIDTH = (Gdx.graphics.getWidth()/Gdx.graphics.getHeight())*HEIGHT;
camera = new OrthographicCamera();
camera.setToOrtho(false, WIDTH, HEIGHT);
Every screen would see the same height in the game world. But some screens would see more in the width than others. If thats a problem for you (you want them to see the same ammount of the world but keep the ratio too), than adding black bars to each side is an option.
So my question is basically what is the optimal width and height to have on a libgdx game?
The optimal solution is having a different set of images for several resolutions. And choosing whats the most appropiate at runtime. But that increases the game size a lot.
Another dirty way is having only one big set and let the images shrink in lower resolutions. It looks better than the inverse. But some people think this is just too dirty :p (not me, so I recommend it).
In the two attached pictures, the desktop screenshot of libgdx functions as expected. The screenshot from my Galaxy Nexus is unfortunately not as expected. I am attempting to create a simple motion blur or trail effect.
Rendering as I expected on my desktop.
Not rendering as I expected on my Galaxy nexus.
The circle textures are drawn in a for loop during rendering and the effect is achieved with a pixmap using the RGBA of 0, 0, 0, 0.1f that is drawn before the circles.
screenClearSprite creation
Pixmap screenClearPixmap = new Pixmap(256, 256, Format.RGBA8888);
screenClearPixmap.setColor(Color.rgba8888(0, 0, 0, 0.1f));
screenClearPixmap.fillRectangle(0, 0, 256, 256);
screenClearTexture = new Texture(screenClearPixmap);
screenClearSprite = new Sprite(screenClearTexture);
screenClearSprite.setSize(screenWidth, screenHeight);
screenClearPixmap.dispose();
Render
batch.begin();
font.draw(batch, "fps:" + Gdx.graphics.getFramesPerSecond(), 0, 20);
screenClearSprite.draw(batch);
for (int i = 0; i < circleBodies.size(); i++) {
tempPos = circleBodies.get(i).getPosition();
batch.draw(circleTexture, (tempPos.x * SCALE) + screenWidthHalf
- circleSizeHalf, (tempPos.y * SCALE) + screenHeightHalf
- circleSizeHalf);
}
batch.end();
So, what did I do wrong? Perhaps there is a better way to get the 'motion blur' effect of movement?
Here is a different approach, where you clear your screen each time with solid color and no alpha.
This means that you will have to modify your code some. The good thing about this, is that the way you are doing it has some flaws: It will blur everything in motion, not just the balls. And can quickly produce ugly results/artefacts unless you are careful.
Do the same as you are doing now, but instead of drawing the balls to the batch, draw them onto a texture/bitmap/whatever. Then each frame add an alpha-blended image over the balls-image, and then draw the balls in their current position on top of that. Then add that image to your screen. Very much like you are doing now, except you draw to something else and keep it. This way you don't have to rely on the viewport you are drawing onto, and can keep everything separated.
This method is similar to drawing to an accumulation buffer.
Instead of doing it the way you are doing, you can keep track of the n latest positions of each ball. And then draw all of them each frame, with different alpha. This is very easy to implement. Can result in many drawing calls if you have many balls or a large n, but if it's not too much it shouldn't limit your fps and gives nice control.
Perhaps there is a better way to get the 'motion blur' effect of
movement?
in order to make motion blur in my game i use another approch "The particle effect" it works realy fine with me and i didn't have Android/Desktop problems or with different android devices
all you have to do is to use "Particle Effect Editor" of Libgdx and make your effect then load it in your project finally draw it at the same position you draw your object (and alos draw your object)
Tips to make the right effect file with Paticle Editor :
set (use) the same image of the object that you want to blur it motion in the particle effect
try to limit the count : the max number of particle allowed
Disable the "velocity" and "Angle"
parameter
Particle effect help to do motion effect
Hope this will help someone !
I am using AndEngine to load a svg images as my Sprites.
The problem I am having with this is that i can't figure out how to scale the image to fit the particular device on which it is being run.
sprite= new Sprite(positionX, positionY, WIDTH,HEIGHT,TextureRegion);
The parameters that it takes are the position's on x and y coordinates, and then width, and height.
The problem I am having is that I can't figure out how to scale the sprite to the right width and height for how I want it.
For example I have a title, and I want the title to be bigger on bigger devices, how would I decide if the device is bigger and scale it up for a bigger screen and down for a smaller screen?
If you use a constant camera size, all of the screen is scaled (Hence all of the entities).
Decide on a constant size, for exaple 720x480.
final static int CAMERA_WIDTH = 720;
final static int CAMERA_HEIGHT = 480;
Then, when creating the engine options, use:
... new EngineOptions(... new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT), ...);
On each device, the camera will scale itself to fit the resolution as good possible, while keeping the ratio between width & height.
Now, when creating a sprite, just do:
Sprite sprite = new Sprite(x, y, TextureRegion);
Don't give the sprite size! Its size comparing to the camera size will be decided according to the texture region size, and it will be a constant one. Then, it will be scaled by the camera-to-device-screen scaling, which changes from one device to another, but the ratio will remain constant - the game will not look like a bad scaled image on devices with a different resoltuion that the camera width/height ratio.
I think that's a great method that AndEngine provides to deal with different screen resolution; IMHO, it is the best to use.