Issue of graphic display using SFML on my laptop

[Alan0354]

Hi
I have issue not able to display the whole picture using SFML graphics on my labtop. I am using the Games with C++ by John Horton. I supposed to get the graphic screen as shown in the book shown in the black and while image( the book only have black and white). What I got running the program is shown in the second color image.

You can see in  that the lower part and the right size of the black and while picture are cut off compare to the color image generated by my program. I copied the program exactly what the book has, everything works except I cannot get the full size display on the screen. How can I fix it?

I don't know how well to post the code of my program:

#include <iostream>
#include <SFML/Graphics.hpp>
using namespace sf;
using namespace std;
int main()
{   VideoMode vm(1920, 1080);//set screen resolution 1920 X 1080
    RenderWindow window(vm, "Timber!!!", Style::Fullscreen);//create window object
    Texture textureBackground;//Create texture to hold graphic on GPU
    textureBackground.loadFromFile("graphics/background.png");//load graphic into texture
    Sprite spriteBackground;//create a sprite
    spriteBackground.setTexture(textureBackground);//attach texture to sprite
    spriteBackground.setPosition(0, 0);//set sprite to cover the screen

    Texture textureTree;
    textureTree.loadFromFile("graphics/tree.png");
    Sprite spriteTree;
    spriteTree.setTexture(textureTree);
    spriteTree.setPosition(810, 0);//810 should put a little left from center

    Texture textureBee;
    textureBee.loadFromFile("graphics/bee.png");
    Sprite spriteBee;
    spriteBee.setTexture(textureBee);
    spriteBee.setPosition(400, 510);
    bool beeActive = false;
    float beeSpeed = 0.0f;

    Texture textureCloud;
    textureCloud.loadFromFile("graphics/cloud.png");
    Sprite spriteCloud1;
    Sprite spriteCloud2;
    Sprite spriteCloud3;
    spriteCloud1.setTexture(textureCloud);
    spriteCloud2.setTexture(textureCloud);
    spriteCloud3.setTexture(textureCloud);
    spriteCloud1.setPosition(0, 0);
    spriteCloud2.setPosition(0, 250);
    spriteCloud3.setPosition(0, 500);
    bool cloud1Active = false;
    bool cloud2Active = false;
    bool cloud3Active = false;
    float cloud1Speed = 0.0f;
    float cloud2Speed = 0.0f;
    float cloud3Speed = 0.0f;
    window.clear();
    window.draw(spriteBackground);
    window.draw(spriteTree);
    window.draw(spriteBee);
    window.draw(spriteCloud1);
    window.draw(spriteCloud2);
    window.draw(spriteCloud3);
    window.display();//Update screen with new background
    while (window.isOpen())//Stay looping until ESC
    { if (Keyboard::isKeyPressed(Keyboard::Escape))
          { window.close(); }//Hit ESC key to exit
    }
    window.clear();
    window.display();
    return 0;
}

thanks

[eXpl0it3r]

I'd recommend taking actual screenshots instead of phone pictures, that makes it easier to judge the actual sizes of things.

Do you have DPI scaling activated?

[Alan0354]

I'd recommend taking actual screenshots instead of phone pictures, that makes it easier to judge the actual sizes of things.

Do you have DPI scaling activated?

Thank you for replying.
This is the screen shot, you can compare with the black and white picture from the book. Somehow, it doesn't show the full image in the post either. You have to download the image to view it.

I tried playing with the display of my laptop as shown in the second picture, I tried changing the resolution and the size. I also went and change the DPI scaling, it doesn't go down below 100, and it won't work if I change anything. So I just leave it at default.

I don't know what else to do.

Thanks

[eXpl0it3r]

But in the screenshot you show your display resolution which is not 1920x1080, so when you render it with a "1920x1080" resolution window, it well won't suddenly be 1902x1080.
Or was that just when you were playing around with it.

What's your screen resolution?

[Alan0354]

But in the screenshot you show your display resolution which is not 1920x1080, so when you render it with a "1920x1080" resolution window, it well won't suddenly be 1902x1080.
Or was that just when you were playing around with it.

What's your screen resolution?

I was just trying to post when you reply:

I think I know why, but don't know how to fix it. Resolution of my laptop is 1366 X 768 maximum. I did an experiment and change one of the sprite to (683, 384) which is exactly half way on both x and y for 1366 X 768 screen. The top left corner of the sprite is DEAD CENTER.

This means the display is moving as if the screen is 1366 X 768 no matter what. Problem is I think all the .png provided are based on 1920 X 1080. So when putting on the screen, everything looks bigger and shift to right and down.

The question is what is the easy way to fix it on the SFML side as my laptop is only 7 months old. I did not buy a laptop for graphics but I did pay like $700 for 512G SSD drive and 8G RAM and latest I-5 7months ago. I hope I don't have to buy a new one.

Thanks

[eXpl0it3r]

Ah okay, no need to buy a new laptop or monitor
I guess it might not be part of the book/tutorial/resource that you're following, but games should anyways be able to handle different resolutions.

The easiest is to just use a matching screen resolution and make use of an sf::View to scale to fit your screen size.

[Alan0354]

Ah okay, no need to buy a new laptop or monitor
I guess it might not be part of the book/tutorial/resource that you're following, but games should anyways be able to handle different resolutions.

The easiest is to just use a matching screen resolution and make use of an sf::View to scale to fit your screen size.

Thanks

I've been reading on line and even go on youtube to get some tutorials, but I am only a few days into learning about SFML, I barely get a few image onto the screen. Can you tell me what to put into my program to set the screen if it is only like one or two lines so I can get on with the book?

Thanks

[kojack]

The easiest way is like this:

window.setView(sf::View(sf::FloatRect(0, 0, 1920, 1080)));

That will change the view (effectively the camera) so the window has a coordinate system of 1920x1080. It will still be physically 1366x768 (the screen res) but everything will be scaled down to fit.

This doesn't deal with aspect ratio though. In the case of 1366x768 scaling to 1920x1080, it's almost identical (aspect of 1.779 vs 1.778). But for other screens that can be an issue. For example my second monitor is 1680x1050 (aspect 1.6). So the above view code would result in everything being stretched vertical a bit (not square).