view / camera

Started by tim_the_cat, 26 August 2022, 15:59:17


hello, I will say right away, English is not my native language, I apologize in advance for the mistakes...
I'm new to tgui, trying to find a way to make a camera by means of tgui. I tried to do it using sf::View, it didn't work, the center of myView changes, but the widgets do not move relative to the center of the screen, probably I don't understand something...

I've been writing because I've spent too much time looking for a solution, and the camera is a necessary aspect of the program I'm building.

please tell me how to implement the camera :<

failed attempt:
while (not end) {
                    sf::Event event;
                    while (window.pollEvent(event)) {
                        switch (event.type) {
                        case sf::Event::Closed:
                            groupSwitching(0);// exit
                        case sf::Event::KeyPressed:
                            if (sf::Keyboard::isKeyPressed(sf::Keyboard::Right)) { // my stupid attempt to make a camera
                                view.setCenter(view.getCenter().x + 10, view.getCenter().y);
                            if (sf::Keyboard::isKeyPressed(sf::Keyboard::Left)) {
                                view.setCenter(view.getCenter().x - 10, view.getCenter().y);

                            std::cout << view.getCenter().x << " " << view.getCenter().y << std::endl;
                        case sf::Event::MouseWheelScrolled:
                            if ( < 0)
                            else if ( > 0)

                            std::cout << view.getCenter().x << " " << view.getCenter().y << std::endl;


The gui ignores the view set in the window, it instead uses its own view.
You can use gui.setAbsoluteView to pass the (left, top, width, height) of the region to show in your window.


Thank you, texus
Your library is very helpful  :D


sorry for the repeated worry, please tell me, how can i implement camera distancing? Using gui.setRelativeViewport({ 0, 0,cameraZoom, cameraZoom }); expectedly leads to a decrease in the visible area and the appearance of "black bars". I have ideas, but they are workarounds, is there a standard way?

 (I'm a fool, but I realized the error)


The viewport defines which area of the window is drawn to (you probably don't want to change this) while the view defines what is drawn to window (or at least the part of the window specified by the viewport).

Both viewport and view can either be given as absolute or relative.
When absolute, they are specified as a certain amount of pixels.
If the viewport is relative, the parameters are a ratio to the window size (e.g. a relative viewport width of 0.6 corresponds to 60% of the window width).
If the view is relative, the parameters are a ratio to the viewport size, which by default equal the window size (e.g. a relative view height of 1.2 equals 120% of the viewport height).

If you just want to zoom then you could use "setRelativeView({0, 0, 0.5f, 0.5f})" to zoom in 2x.
If your window is 800x600, then it renders everything within the (0, 0, 0.5 * 800, 0.5 * 600) coordinates to the window, thus magnifying the gui.

If cameraZoom is greater than 1, then "setRelativeView({0, 0, cameraZoom, cameraZoom)" will zoom out.
Note that you need setRelativeView and not setRelativeViewport!