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

Author Topic: Round View  (Read 3456 times)

0 Members and 1 Guest are viewing this topic.

etixpp

  • Jr. Member
  • **
  • Posts: 82
    • View Profile
    • FoxFire Development Website
    • Email
Round View
« on: October 31, 2013, 08:53:23 am »
Hello,
i want to make a Minimap in form of a round circle.
I already managed it without problems to make a foursquare minimap with a second view, but is there a way to make it round?

fallahn

  • Hero Member
  • *****
  • Posts: 507
  • Buns.
    • View Profile
    • Trederia
Re: Round View
« Reply #1 on: October 31, 2013, 09:50:28 pm »
Assuming you're rendering the minimap to a render texture you can use a shader:

Uniform sampler2d tex;

Const float radius = 0.5;
Const float centre = 0.5;

Void main
{
Vec2 UV = gl_texcoord[0].xy;
Vec4 colour = texture2d(TeX, UV);
Const float distance = distance(centre, UV);
If(distance > radius) colour.a = 0;
gl_fragcolor = colour;
}

 

AlejandroCoria

  • Jr. Member
  • **
  • Posts: 68
    • View Profile
    • alejandrocoria.games
    • Email
Re: Round View
« Reply #2 on: October 31, 2013, 10:39:13 pm »
if you're rendering the minimap to a render texture you can also use a vertexarray, to create a circle with vertices and texture coordinates.

etixpp

  • Jr. Member
  • **
  • Posts: 82
    • View Profile
    • FoxFire Development Website
    • Email
Re: Round View
« Reply #3 on: October 31, 2013, 11:05:01 pm »
Sounds good fallahn, but my experience with shader is nearly zero.

i tried to implement your snippet with  (tried vertex and fragment)

sf::Shader shader;

// load only the vertex shader
if (!shader.loadFromFile("shader.vert", sf::Shader::Vertex))
{
    std::cout << "errorshadder";
}
shader.setParameter("texture", sf::Shader::CurrentTexture);
 


and


                        /* MINIMAP */
                        sf::View testview(sf::FloatRect(0, 0, 120, 120));
                        testview.setViewport((sf::FloatRect(0.75, 0.1, 0.2, 0.2)));
                        testview.zoom(10);
                        testview.setCenter(MainPlayer.GetPlayerSprite().getPosition().x+16,MainPlayer.GetPlayerSprite().getPosition().y+16);
                        window.setView(testview);
                        window.draw(MainChunk->GetBgSprite(),&shader);
       
                        if(MainPlayer.GetPlayerDirection() == 1)
                        {
                        window.draw(MainChunk->GetMainSprite(),&shader);
                        window.draw(MainPlayer.GetPlayerSprite(),&shader);

                        }
                        else
                        {
                        window.draw(MainPlayer.GetPlayerSprite(),&shader);
                        window.draw(MainChunk->GetMainSprite(),&shader);
                        }
                        window.draw(circle);
                        window.draw(MainChunk->GetCollisionSprite(),&shader);


but i get a mass of compiling errors, i tried a few things and tried to set it up like in the tutorial but failed kinda hard x.X

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6287
  • Thor Developer
    • View Profile
    • Bromeon
Re: Round View
« Reply #4 on: October 31, 2013, 11:16:05 pm »
No shader is necessary.
  • Use a sf::RenderTexture that is cleared with a transparent color.
  • Draw the minimap to the render texture.
  • Draw a sf::CircleShape to the screen, using that render texture as texture.

By the way: This will be much simpler once render masks are implemented in SFML, but this may take a while. To learn about shaders, read a GLSL tutorial. But computing the distance for every single pixel will be expensive, even with obvious optimizations such as comparing squares.
« Last Edit: October 31, 2013, 11:20:27 pm by Nexus »
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

fallahn

  • Hero Member
  • *****
  • Posts: 507
  • Buns.
    • View Profile
    • Trederia
Re: Round View
« Reply #5 on: October 31, 2013, 11:19:31 pm »
yeah sorry, my tablet messed up the casings of the variables (the predictive text was determined to fight me :S ) Anyway what Nexus said about CircleShape actually sounds like a much better idea

etixpp

  • Jr. Member
  • **
  • Posts: 82
    • View Profile
    • FoxFire Development Website
    • Email
Re: Round View
« Reply #6 on: October 31, 2013, 11:30:53 pm »
                        // MINIMAP
                        RenderTexture.clear(sf::Color(0,0,0,0));
                        sf::CircleShape MinimapShape(50.F);
                        sf::View testview(sf::FloatRect(0, 0, 120, 120));
                        testview.setViewport((sf::FloatRect(0.75, 0.1, 0.2, 0.2)));
                        testview.zoom(10);
                        testview.setCenter(MainPlayer.GetPlayerSprite().getPosition().x+16,MainPlayer.GetPlayerSprite().getPosition().y+16);
                        RenderTexture.setView(testview);
                        RenderTexture.draw(MainChunk->GetBgSprite());
                        if(MainPlayer.GetPlayerDirection() == 1)
                        {
                        RenderTexture.draw(MainChunk->GetMainSprite());
                        RenderTexture.draw(MainPlayer.GetPlayerSprite());

                        }
                        else
                        {
                        RenderTexture.draw(MainPlayer.GetPlayerSprite());
                        RenderTexture.draw(MainChunk->GetMainSprite());
                        }
                        //RenderTexture.draw(circle);
                        RenderTexture.draw(MainChunk->GetCollisionSprite());
               
                        MinimapShape.setTexture(&RenderTexture.getTexture());
                        window.draw(MinimapShape);
                        window.display();

I did it like this but actually nothing happens, probably a mistake by me?

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6287
  • Thor Developer
    • View Profile
    • Bromeon
Re: Round View
« Reply #7 on: October 31, 2013, 11:40:57 pm »
How do you usually solve problems? Don't write such a lot of code at once and wonder why it doesn't work. Get first familiar with sf::RenderTexture (which includes reading the doc and finding out about display()), then test the render texture on its own to make sure you use it correctly, and then embed it into the existing application.

Also, I don't see why you declare MinimapShape miles before it is used. Keep variables local, it helps you (and others) understand your code better.
« Last Edit: October 31, 2013, 11:43:42 pm by Nexus »
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

etixpp

  • Jr. Member
  • **
  • Posts: 82
    • View Profile
    • FoxFire Development Website
    • Email
Re: Round View
« Reply #8 on: November 01, 2013, 12:12:41 am »
Fixed it now, thanks for great help :)