Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Weird Image Crushing  (Read 4143 times)

0 Members and 1 Guest are viewing this topic.

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« on: September 05, 2010, 06:44:32 am »
Whenever I draw a rectangle and then draw a circle ontop of it, the circle is elangated vertically. The same thing happens with other shapes.

___________
|__________|
|__________|
___________
this becomes

___________
|__________|
|__________|
|__________|
|__________|
|__________|
___________
this....

Please assist. :D

EDIT: Spaced out the shapes
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #1 on: September 05, 2010, 10:17:06 am »
Can you show your code?
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #2 on: September 05, 2010, 07:28:35 pm »
Heehee. This is gonna take up a lot of space, but Okay! :) Here you go.

EDIT: TOOK OFF CODE
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #3 on: September 05, 2010, 07:31:39 pm »
Ok... what about a minimal code that reproduces the same problem? I mean, you can probably remove 95% of code that's not relevant to the problem that you describe.
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #4 on: September 05, 2010, 07:32:47 pm »
Hehe. Figured you say something to that effect. Hold on a second.
-Wander

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #5 on: September 05, 2010, 07:39:17 pm »
How's this?


Code: [Select]
#include <iostream>
#include <SFML/Graphics.hpp>
#include <SFML/System.hpp>
#include <SFML/Audio.hpp>
#include <fstream>


using std::string;
using std::ios;
using std::ofstream;
using std::ifstream;

int main()
{
    sf::RenderWindow App(sf::VideoMode::GetMode(0), "Laz's Interactive Map :: The Wrath... :: PvP Created");

    /// ///////////////////////////////////////
    /// ///
    /// /// MAP STUFF /////////////////////////
    /// ///
    /// ///////////////////////////////////////

    // Creates the PE map :: 9000x3000
    sf::Shape Map;
    Map.AddPoint(0,0,sf::Color(0,100,0));
    Map.AddPoint(9000,0,sf::Color(0,100,0));
    Map.AddPoint(9000,3000,sf::Color(0,100,0));
    Map.AddPoint(0,3000,sf::Color(0,100,0));
    Map.EnableFill(true);
    Map.EnableOutline(false);
    Map.SetOutlineWidth(10);

    // Adds the 1000x1000 dividing line
    sf::Shape Vert0 = sf::Shape::Line(0, 0, 0, 3000, 20, sf::Color::Green);
    sf::Shape Vert1 = sf::Shape::Line(1000, 0, 1000, 3000, 20, sf::Color::Green);
    sf::Shape Vert2 = sf::Shape::Line(2000, 0, 2000, 3000, 20, sf::Color::Green);
    sf::Shape Vert3 = sf::Shape::Line(2995, 0, 2995, 3000, 10, sf::Color::Green);
    sf::Shape Vert35 = sf::Shape::Line(3005, 0, 3005, 3000, 10, sf::Color::Red);
    sf::Shape Vert4 = sf::Shape::Line(4000, 0, 4000, 3000, 20, sf::Color::Red);
    sf::Shape Vert5 = sf::Shape::Line(5000, 0, 5000, 3000, 20, sf::Color::Red);
    sf::Shape Vert6 = sf::Shape::Line(5995, 0, 5995, 3000, 10, sf::Color::Red);
    sf::Shape Vert65 = sf::Shape::Line(6005, 0, 6005, 3000, 10, sf::Color::Yellow);
    sf::Shape Vert7 = sf::Shape::Line(7000, 0, 7000, 3000, 20, sf::Color::Yellow);
    sf::Shape Vert8 = sf::Shape::Line(8000, 0, 8000, 3000, 20, sf::Color::Yellow);
    sf::Shape Vert9 = sf::Shape::Line(9000, 0, 9000, 3000, 10, sf::Color::Yellow);

    sf::Shape Hor1 = sf::Shape::Line(0, 1000, 9000, 1000, 20, sf::Color::Black);
    sf::Shape Hor2 = sf::Shape::Line(0, 2000, 9000, 2000, 20, sf::Color::Black);
    sf::Shape Hor3 = sf::Shape::Line(0, 3000, 9000, 3000, 20, sf::Color::Black);

    //Makes the view for the map :: Middle Layer
    sf::Vector2f Center(4500, 1500);
    sf::Vector2f HalfSize(2250, 750);
    sf::View View(Center, HalfSize);
    View.Zoom(0.35f);

    /// ///////////////////////////////////////
    /// ///
    /// /// PVP INFORMATION ///////////////////
    /// ///
    /// ///////////////////////////////////////

    // War Capital Coordinates
    sf::Shape WarCap1 = sf::Shape::Circle(3500, 500, 50, sf::Color::Cyan);
    sf::Shape WarCap2 = sf::Shape::Circle(4500, 500, 50, sf::Color::Cyan);
    sf::Shape WarCap3 = sf::Shape::Circle(5500, 500, 50, sf::Color::Cyan);
    sf::Shape WarCap4 = sf::Shape::Circle(3500, 1500, 50, sf::Color::Cyan);
    sf::Shape WarCap5 = sf::Shape::Circle(4500, 1500, 50, sf::Color::Cyan);
    sf::Shape WarCap6 = sf::Shape::Circle(5500, 1500, 50, sf::Color::Cyan);
    sf::Shape WarCap7 = sf::Shape::Circle(3500, 2500, 50, sf::Color::Cyan);
    sf::Shape WarCap8 = sf::Shape::Circle(4500, 2500, 50, sf::Color::Cyan);
    sf::Shape WarCap9 = sf::Shape::Circle(5500, 2500, 50, sf::Color::Cyan);

    /// ///////////////////////////////////////
    /// ///////////////////////////////////////
    /// ///////////////////////////////////////
    /// ///////////////////////////////////////
    /// ///////////////////////////////////////

    // Main loop
    while (App.IsOpened())
    {
        // Event loop
        sf::Event Event;
        while (App.GetEvent(Event))
        {
            // Close window : exit
            if (Event.Type == sf::Event::Closed)
                App.Close();

            // Press escape : exit
            if ((Event.Type == sf::Event::KeyPressed) && (Event.Key.Code == sf::Key::Escape))
                App.Close();
        }
       
        App.SetView(View);

            App.Draw(Map);

            App.Draw(Vert0);
            App.Draw(Vert1);
            App.Draw(Vert2);
            App.Draw(Vert3);
            App.Draw(Vert35);
            App.Draw(Vert4);
            App.Draw(Vert5);
            App.Draw(Vert6);
            App.Draw(Vert65);
            App.Draw(Vert7);
            App.Draw(Vert8);
            App.Draw(Vert9);

            App.Draw(Hor1);
            App.Draw(Hor2);
            App.Draw(Hor3);

            App.Draw(WarCap1);
            App.Draw(WarCap2);
            App.Draw(WarCap3);
            App.Draw(WarCap4);
            App.Draw(WarCap5);
            App.Draw(WarCap6);
            App.Draw(WarCap7);
            App.Draw(WarCap8);
            App.Draw(WarCap9);

            App.Display();
    }



    return 0;
}
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #6 on: September 05, 2010, 08:36:38 pm »
Good enough ;)

The problem is that your view doesn't keep the original aspect ratio of the window, so everything appears wider on the Y axis. You just need to adjust the size of your view.
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #7 on: September 05, 2010, 08:39:41 pm »
I'm not even to try to pretend I understand how views work. They confuse me. I've read the tutorial many times, but I don't get it. So, in turn I don't have the faintest idea on how to adjust the aspect ratio of the view. haha
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #8 on: September 05, 2010, 08:48:13 pm »
The view is the part of the 2D world that will be displayed in the window.
In other words, the area of the 2D world defined by the view will be stretched to fit in the whole area of the window. So if their aspect ratio is different, the 2D world will appear distorted.

It's like when you take a picture of you and you display it in fullscreen on your computer. If your monitor doesn't have the same aspect ratio as the original picture, the picture will look distorted.

Let's take a very simple example:
- window = 1000x1000
- view = 1000x500
Here, the X axis will appear unchanged because 1000 pixels of the 2D world will be displayed on exactly 1000 pixels of the window. It's a 1:1 mapping.
However, for the Y axis, 500 pixels of the 2D world will be displayed in 1000 pixels of the window, so the 2D world will be stretched by a factor 2 so that it fits in the window. That's a 2:1 mapping.
As a consequence, things will look twice higher as they are actually.

I hope things are clearer now ;)
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #9 on: September 05, 2010, 08:51:48 pm »
Okay. It is clearer, but some questions.

Code: [Select]
//Makes the view for the map :: Middle Layer
    sf::Vector2f Center(4500, 1500);
    sf::Vector2f HalfSize(2250, 750);
    sf::View View(Center, HalfSize);
    View.Zoom(0.35f);


That's my view settings.

The window I'm using is in DesktopMode which, if I understand correctly, is when the window fits itself to the user's desktop. Correct?

So, is there a way to set the to DesktopMode also so that way the aspect ratio doesn't change from screen to screen.

Also, what exactly does Center and halfsize mean?
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #10 on: September 05, 2010, 08:55:56 pm »
Quote
So, is there a way to set the to DesktopMode also so that way the aspect ratio doesn't change from screen to screen.

You can change the desktop mode if the window runs in fullscreen mode, I don't know if that's what you want though.

Why don't you adjust the size of your view, instead of adjusting the desktop video mode?

Quote
Also, what exactly does Center and halfsize mean?

?
Center is the center point of the view, and half size is half of the size of the view. Sorry, I don't know how to say it differently.
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #11 on: September 05, 2010, 09:01:45 pm »
Quote
Quote
So, is there a way to set the to DesktopMode also so that way the aspect ratio doesn't change from screen to screen.


You can change the desktop mode if the window runs in fullscreen mode, I don't know if that's what you want though.

Why don't you adjust the size of your view, instead of adjusting the desktop video mode?


I meant to say, "Set the VIEW to DesktopMode". Haha! So, you're suggesting not even running in fullscreen at all? Just keep it in a window?

Quote
Quote
Also, what exactly does Center and halfsize mean?


?
Center is the center point of the view, and half size is half of the size of the view. Sorry, I don't know how to say it differently.


This sounds like the center and halfsize would be the same numbers. The center is halfway across the y and x axis of the shape. So, halfway across the x and y axis of the shape would be the center.

I don't think I'm getting it. haha
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #12 on: September 05, 2010, 10:49:33 pm »
Quote
I meant to say, "Set the VIEW to DesktopMode"

Ok I see.
This piece of code creates a view with the same size as the window:
Code: [Select]
sf::View view(sf::FloatRect(0, 0, window.GetWidth(), window.GetHeight());

Quote
This sounds like the center and halfsize would be the same numbers. The center is halfway across the y and x axis of the shape. So, halfway across the x and y axis of the shape would be the center.

Indeed, center and half-size are equal if the top-left corner of the view is located at (0, 0).
Laurent Gomila - SFML developer

Wander

  • Full Member
  • ***
  • Posts: 170
    • View Profile
    • Email
Weird Image Crushing
« Reply #13 on: September 05, 2010, 11:49:23 pm »
OH!! Okay! Sweet! It's working now. Awesome thanks.

What are the 4 parameters? I can't find what they mean in the tutorials.
-Wander

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32504
    • View Profile
    • SFML's website
    • Email
Weird Image Crushing
« Reply #14 on: September 06, 2010, 08:26:57 am »
Quote
What are the 4 parameters? I can't find what they mean in the tutorials

This kind of stuff is better explained in the API documentation.
http://www.sfml-dev.org/documentation/1.6/classsf_1_1Rect.htm#0f19f5cf78eb52f122b904fb258acfce
Laurent Gomila - SFML developer

 

anything