Movement and sizes on different resolutions

[Skaldi]

Hello all,

I have started using SFML 3 days ago, and I am making my first project with it, which will be an Arkanoid Clone for Android.
So far it is very intuitive and easy to learn, and I am making good progress.

Now there comes 1 problem. As the whole game is happening in one small and confined area, there will be no scrolling necessary. And the problem is that the mobile phones will have different resolutions, but the game should always be displayed the same way. And the problem which I am seeing coming is following:

My mobile phone has a resolution of 1080x1920 in portrait mode. Now I am setting all the coordinates and the sizes of the sprites according to it. But another mobile phone might have a different resolution. This means I will need to adjust all the coordinates accordingly, so that the scene will look the same way as on my mobile phone. And not that all the sprites are drawn out of the screen, or the scene just fills out 3/4 of the screen. Actually this is a simple multiplication and could be done.

But it does not end here. The ball and the paddle and other things, they move in a certain speed. And when there is a different resolution, the speed will be slower or faster, as there are less or more pixels to traverse, which is not acceptable. And also here to multiply the speed so that it is the same in all resolutions feels a bit cumbersome and not right.

So my question is, can I somehow have my coordinate system to be 0.0 is center -1.0 is left and +1.0 is right? The same for up and down? How can I achieve this? Or is there a better solution which I am not aware of?

I hope I could describe my problem in a meaningful way.

Thank you all for your help in advance.

Best regards,
Skaldi

[Skaldi]

I was reading through my post again and want to express the goal which I want achieve better:

I want that the coordinate (-1.0, 0.0) is the left side of the window and (1.0, 0.0) is the right side of the window and (0.0, - 1.0) is the top and (0.0, 1.0) the bottom, no matter what the size of the window is.

Is this possible? Or is there a better way to work with different resolutions?

Thank you again for the help!

[Skaldi]

Yeeeeh, I figured it out  ,

I can manipulate the view. With this codesnippet my View goes from (0.0, 0.0) to (1.0, aspectRatio), which is even better than that what I wanted. Now I don't need to bother because of the resolution anymore. Very simple. The more I work with SFML, the more I like it.

sf::View view = m_Window.getDefaultView();
view.setSize(sf::Vector2f{ 1.0f, static_cast<float>(m_Window.getSize().y) / static_cast<float>(m_Window.getSize().x) });
view.setCenter(view.getSize() / 2.0f);
m_Window.setView(view);
 

Thank you for this great library.

Best regards,
Stefan

[Hapax]

In case you actually wanted to use the -1 to 1 method, the view is really simple:

sf::View view;
view.setCenter(0.f, 0.f);
view.setSize(2.f, 2.f);

or, more succinctly:

sf::View view(sf::Vector2f(0.f, 0.f), sf::Vector2f(2.f, 2.f));

[Skaldi]

Thank you for the tip.

But in a 2nd thought for this project it is better to have it 1.0f and aspectrstio resolution, as I will use a generously sized blank area for moving the paddle, just on the bottom of the screen.
And in case of a different aspect ratio, this can be a bit bigger or smaller and in theory it should look good on each mobile phone.

But I adapt your approach of creating a new view object instead of copying the default view. This code looks much more clean

[Hapax]

Of course; use whatever co-ordinate system you prefer

To be clear, the sf::View object I created above does not actually set the view but it holds the new view for whenever you want to use it. When you need to use this view, you need to set the window's view to this object. i.e.:

window.setView(view);