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

Author Topic: Drawing bold lines  (Read 6115 times)

0 Members and 2 Guests are viewing this topic.

diego997

  • Newbie
  • *
  • Posts: 21
    • View Profile
Drawing bold lines
« on: December 06, 2012, 01:47:30 pm »
Hi, sorry for bothering you again but I was trying to do it by my self and I couldnt figure this out. Can you tell me how to draw bold lines by using vertices ? I need it for simple "paint remake"

Laurent

  • Administrator
  • Hero Member
  • *****
  • Posts: 32498
    • View Profile
    • SFML's website
    • Email
Re: Drawing bold lines
« Reply #1 on: December 06, 2012, 01:49:56 pm »
Isn't a "bold line" simply a rectangle?
Laurent Gomila - SFML developer

diego997

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Drawing bold lines
« Reply #2 on: December 06, 2012, 02:47:10 pm »
yes but I have to use vertex instead of circle or rectangle because while moving mouse cursor, drawing can not catch up the cursor.


P.S sory that I did not post it in Graphics topic

masskiller

  • Sr. Member
  • ****
  • Posts: 284
  • Pointers to Functions rock!
    • MSN Messenger - kyogre_jb@hotmail.com
    • View Profile
    • Email
Re: Drawing bold lines
« Reply #3 on: December 06, 2012, 03:46:41 pm »
You can just use a quad and have the two vertices of one end change position according to the cursor, otherwise all you would get is a 1 pixel-wide line.
Programmer, Artist, Composer and Storyline/Script Writer of "Origin of Magic". If all goes well this could turn into a commercial project!

Finally back into the programming world!

Foaly

  • Sr. Member
  • ****
  • Posts: 453
    • View Profile
Re: Drawing bold lines
« Reply #4 on: December 06, 2012, 04:16:58 pm »
A little while ago I wrote a class that draws round ended lines. Take a look at it here: https://github.com/SFML/SFML/wiki/Source%3A-Round-Ended-Lines maybe that's what your looking for. Or you can use it as a inspiration to write you own line class.

diego997

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Drawing bold lines
« Reply #5 on: December 06, 2012, 08:30:47 pm »
@masskiller can you give a little bit of code concerning your idea :D


@Foaly Nice class :) To be honest I have never inherited from any SFML classes ;p This is something new that I have to learn, ty for code :)

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6287
  • Thor Developer
    • View Profile
    • Bromeon
Re: Drawing bold lines
« Reply #6 on: December 06, 2012, 08:55:52 pm »
To be honest I have never inherited from any SFML classes ;p
There are only a few for which it makes sense, in the Graphics package mainly sf::Shape, sf::Drawable and sf::Transformable.

For things like sf::Sprite, composition is almost always a better approach than inheritance.
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

masskiller

  • Sr. Member
  • ****
  • Posts: 284
  • Pointers to Functions rock!
    • MSN Messenger - kyogre_jb@hotmail.com
    • View Profile
    • Email
Re: Drawing bold lines
« Reply #7 on: December 06, 2012, 09:58:32 pm »
I don't know what specifically are you trying to do, but I'll post a brief example of my idea.

Say you have a quad and you define it before the loop:

 sf::Vertex vertices[] =
 {
     sf::Vertex(sf::Vector2f(  0,  width), sf::Color::Red),
     sf::Vertex(sf::Vector2f(  width, width), sf::Color::Red),
     sf::Vertex(sf::Vector2f(0, height), sf::Color::Red),
     sf::Vertex(sf::Vector2f(width,   heigth), sf::Color::Red)
 };
///This is a straight vertical line.
///Color isn't relevant.
 

Then you want to make one side of your bold line to move with your cursor, so inside your loop you need something like this:

vertices[2].position = sf::Vector2i(sf::Mouse::getPosition().x + width/2, sf::Mouse::getPosition().y + heigth/2);
vertices[3].position = sf::Vector2i(sf::Mouse::getPosition().x - width/2, sf::Mouse::getPosition().y - height/2);
///Note that this isn't tested, but it kind of goes like this.
 

That would be a fast approach but it gives many problems, first is that if you move your mouse to certain positions it will not display the line properly (or even not at all). This only works if you want something extremely simple, when I gave the idea I didn't give it much thought. It would work on a line certainly, but not on a quad.

The approach that would really work is to use the rotation matrix in all the vertices positions, first you calculate the angle of where the mouse is according to the bold line's first two positions (use the mid point between both as an origin of angle calculation) and then you multiply each position vector using the rotation matrix with the angle that the mouse was calculated in. The height of line would depend if you want it to be fixed or to be extended as far as the mouse is located.

http://en.wikipedia.org/wiki/Rotation_matrix

As you can see it has a lot of linear algebra underneath, if it was a single line it would be as easy as changing the end point position, but given you want a bold line you need a quad, which requires mathematical rotation and so on.

Alternatively you could also use the not so efficient method of putting lots of lines in a VertexArray together so that they look like a bold line even though they are just many lines next to each other, it's easier to program (just change the end position of all of the with mouse position), but you may end up using a lot of vertexes for something that needs only four in the end.

http://www.sfml-dev.org/documentation/2.0/classsf_1_1Vertex.php
http://www.sfml-dev.org/documentation/2.0/classsf_1_1Mouse.php#a93b4d2ebef728e77a0ec9d83c1e0b0c8
http://www.sfml-dev.org/documentation/2.0/classsf_1_1VertexArray.php

Then again it all depends if you want a fixed height parameter. I just gave some bases of how it should be done, but it varies greatly on how you want to use mouse position for your bold line. The linear algebra approach is on order to get consistency in your bold lines (always same width, height maybe if you wish so). The first approach I listed can work if you don't care about it.
« Last Edit: December 06, 2012, 10:13:28 pm by masskiller »
Programmer, Artist, Composer and Storyline/Script Writer of "Origin of Magic". If all goes well this could turn into a commercial project!

Finally back into the programming world!

diego997

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Drawing bold lines
« Reply #8 on: December 07, 2012, 08:29:36 am »
@Nexus thank you for emphasize this so I will just analize how to properly use inheritance for sf::Sprite :D

@masskiller nice explanation, it is not as easy as I thought I will have to recall basis of linera algebra ;d

Foaly

  • Sr. Member
  • ****
  • Posts: 453
    • View Profile
Re: Drawing bold lines
« Reply #9 on: December 07, 2012, 08:37:49 pm »
I don't want to confuse you or anything, but when I wrote my line class I had a look at the old Line class from SFML 1.6. It works somewhat different then in 2.0, but the interesting part (normal, extrusion..) is the same. Take a look: https://github.com/SFML/SFML/blob/sfml1/src/SFML/Graphics/Shape.cpp#L184
With that and my Line class you should be able to easily write your own class ;)

Nexus

  • SFML Team
  • Hero Member
  • *****
  • Posts: 6287
  • Thor Developer
    • View Profile
    • Bromeon
Re: Drawing bold lines
« Reply #10 on: December 07, 2012, 08:54:04 pm »
@Nexus thank you for emphasize this so I will just analize how to properly use inheritance for sf::Sprite :D
Not at all, use composition ;)

By the way, in case you use Thor, there is a function thor::Shapes::line() which creates a line shape.
Zloxx II: action platformer
Thor Library: particle systems, animations, dot products, ...
SFML Game Development:

diego997

  • Newbie
  • *
  • Posts: 21
    • View Profile
Re: Drawing bold lines
« Reply #11 on: December 08, 2012, 02:52:46 pm »
@nexus nice to be honest I am the most intrested in particle system :D I am going to download it :)

sry for offtop