SFML/SFML

`sf::ConvexShape` outline glitching when shape is too small

chu65536 opened this issue · 5 comments

Subject of the issue

I've tried to render some simple 3D rotating cube using triangles.
Triangles were implemented with sf::ConvexShape. When i added sf::ConvexShape.setOutlineColor. I noticed graphical glitch that occurs when the side of a cube becomes too small when rotated. I will add video to be clear.

Your environment

  • Distro: Ubuntu 22.04.3 LTS
  • SFML version: 2.6.x
  • Compiler: gcc (Ubuntu 11.4.0-1ubuntu1~22.04) 11.4.0

Steps to reproduce

#include <iostream>
#include <SFML/Graphics.hpp>

int main() {
    sf::RenderWindow window(sf::VideoMode(800u, 800u), "");

    sf::ConvexShape shape;
    shape.setPointCount(3);
    sf::Vector2f p1(100.f, 100.f);
    sf::Vector2f p2(200.f, 200.f);
    sf::Vector2f p3(100.f, 400.f);

    shape.setPoint(0, p1);
    shape.setPoint(1, p2);
    shape.setPoint(2, p3);

    shape.setFillColor(sf::Color::Green);
    shape.setOutlineColor(sf::Color::White);
    shape.setOutlineThickness(2);

    sf::Clock clock;
    while(window.isOpen()) {
        float dt = clock.restart().asSeconds();
        sf::Event event;
        while(window.pollEvent(event)) {
            if (event.type == sf::Event::Closed) {
                window.close();
            }
        }
        if (sf::Keyboard::isKeyPressed(sf::Keyboard::S)) {
            p1.y += 100.f * dt;        
        }
        if (sf::Keyboard::isKeyPressed(sf::Keyboard::W)) {
            p1.y -= 100.f * dt;        
        }
        if (sf::Keyboard::isKeyPressed(sf::Keyboard::A)) {
            p1.x -= 100.f * dt;        
        }
        if (sf::Keyboard::isKeyPressed(sf::Keyboard::D)) {
            p1.x += 100.f * dt;        
        }

        shape.setPoint(0, p1);
        shape.setPoint(1, p2);
        shape.setPoint(2, p3);
        
        window.clear();
        window.draw(shape);
        window.display();
    }
}
2023-10-08.18-41-17.mp4

As the internal angle approaches zero, I'd actually expect the outline's corner point to move very far from the shape. To fix this we'd have to do something like support rounded edges on outlines.

I guess it's mathematically correct, but maybe there's a visual limit we can set for very small angles

This brings to mind SVG stroke-miterlimit attribute. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-miterlimit

This brings to mind SVG stroke-miterlimit attribute. See https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-miterlimit

I like this behavior. I'd support this feature. I'm unsure how hard it will be to implement though.

I'm unsure how hard it will be to implement though.

Not very hard. I could give it a try next weekend.