Results 1 to 6 of 6

Thread: Round QSlider

  1. #1
    Join Date
    Oct 2006
    Posts
    13
    Thanks
    12
    Thanked 1 Time in 1 Post
    Qt products
    Qt4
    Platforms
    Windows

    Default Round QSlider

    hi.

    I want to make a slider-configuration like this:

    Any suggestions on how to make a round QSlider that will allow other sliders to fit inside it?

    I don't want it to be continuous, it should have a start and end-point so you can't keep rotating it around.

    thanks,
    Havard

  2. #2
    Join Date
    Feb 2006
    Location
    Romania
    Posts
    2,744
    Thanks
    8
    Thanked 541 Times in 521 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Round QSlider

    Yes, really nice.
    You should have a custom widget for that. The widget must be all transparent besides the circle and the ellipse knob.

    You can achieve this by filling the (rectangular) widget with a transparent pixmap. then draw a circle( inscribed in the widget bounding rect - actually square ).

    For the knob you can simply draw an ellipse and store its bounding rect as a member in the class.
    Next you must implement mousePressEvent, mouseReleaseEvent and mouseMoveEvent. These will make possible the interaction with the knob.
    For the horizontal and vertical sliders you should use the same class, but add some flags to it that will tell it how to paint the slider( as a circle, horizontal, etc... ).

    You can add a valueChanged signal that you emit in mouseMoveEvent, when the user drags the knob and the value changes.

    That's how I would do it.

    BTW: to make the two smaller sliders fit, you should compute the square inscribed in the circle( its diagonal is equal with the circle diameter ), therefore the length of a slider is sqrt(2)*diameter.

    Regards
    Last edited by marcel; 25th June 2007 at 20:55.

  3. The following user says thank you to marcel for this useful post:

    Havard (25th June 2007)

  4. #3
    Join Date
    Feb 2006
    Location
    Romania
    Posts
    2,744
    Thanks
    8
    Thanked 541 Times in 521 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Round QSlider

    Of course, you could use a QGraphicsView also , but this would be efficient only if you want your widget to always look like that ( three sliders ).

    Regards

  5. The following user says thank you to marcel for this useful post:

    Havard (25th June 2007)

  6. #4
    Join Date
    Oct 2006
    Posts
    13
    Thanks
    12
    Thanked 1 Time in 1 Post
    Qt products
    Qt4
    Platforms
    Windows

    Default Re: Round QSlider

    thank you! Will experiment with that!
    Any suggestions on an easy way to rotate the knob while it is being turned around? (unless I just make it perfectly round to avoid the trouble...)

    Havard

    EDIT: just saw your suggestions of using QGraphicsView. I guess that solves the rotating-problem then...

    Havard

  7. #5
    Join Date
    Feb 2006
    Location
    Romania
    Posts
    2,744
    Thanks
    8
    Thanked 541 Times in 521 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Round QSlider

    Yes, that is a bit trickier.

    You must use QPainter::rotate before you draw the knob and pass it the angle between the mouse vector and the normal vector on the Ox axis.
    Having two vectors va and vb, the angle is: angle = acos(va•vb/ |va||vb|), where || is the euclidean norm.

    Or, even better, you could compute the angle by working in polar coordinates. Considering the fact that you always move on a circle, then this is pretty straightforward.
    You can read this: http://en.wikipedia.org/wiki/Polar_coordinate_system.

    EDIT: well, OK then. I guess QGraphicsView will make things easier in a lot of ways.

    Regards

  8. #6
    Join Date
    Feb 2006
    Location
    Romania
    Posts
    2,744
    Thanks
    8
    Thanked 541 Times in 521 Posts
    Qt products
    Qt4
    Platforms
    Unix/X11 Windows

    Default Re: Round QSlider

    The easiest way to make a graphics item move on a circle when dragged is to reimplement QGraphicsItem::itemChanged and restrict its position to be on the circle when GraphicsItemChange==ItemPositionChange.

    Regards

  9. The following user says thank you to marcel for this useful post:

    Havard (25th June 2007)

Similar Threads

  1. Problems customizing QSlider
    By Antrax in forum Qt Programming
    Replies: 13
    Last Post: 20th December 2011, 08:00
  2. QSlider Update Problem
    By December in forum Qt Programming
    Replies: 4
    Last Post: 10th September 2006, 05:02
  3. QSlider with double Heads..
    By moizahamedv in forum Qt Tools
    Replies: 5
    Last Post: 9th May 2006, 15:28
  4. Video and QSlider
    By ToddAtWSU in forum Qt Programming
    Replies: 2
    Last Post: 1st May 2006, 20:37
  5. Round Button
    By Seema Rao in forum Qt Programming
    Replies: 1
    Last Post: 25th April 2006, 12:32

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Digia, Qt and their respective logos are trademarks of Digia Plc in Finland and/or other countries worldwide.