moving one graphical item over other item...

[salmanmanekia]

Hi,
I want to make the green circle move through the big grey circle as if it is a progress bar...please see the link ..
i am not at all sure how to accomplish this,for my part i think it would be somehow through QPainterPath,its what i think....any help

[wysota]

With what exactly do you have a problem? This seems a simple task...

[salmanmanekia]

basically i have implemented the picture in the previous attachment such that the green circle is expressed by QPainterPath..while the grey circle has been drawn in paint() function of QGraphics Item...
i'll post the code here , i am not sure if doing things this way ,i would be able to move the green circle on grey circle...here is the code

ProgressWidget::ProgressWidget()
{
		r1.setRect(85,-13.5,30,30);
		path.addEllipse(r1);
}
 
void ProgressWidget::paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
                       QWidget *widget)
            {
		painter->save();
			painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
                painter->drawEllipse(0, 0, 200, 200);
                painter->restore();
                painter->fillPath( path, QBrush( Qt::green, Qt::SolidPattern ) );  
             }
QRectF ProgressWidget::boundingRect() const
            {
                qreal penWidth = 150;
                return QRectF(-10 - penWidth / 2, -10 - penWidth / 2,20 + penWidth / 2, 20 + penWidth / 2);
            }

ProgressWidget::ProgressWidget()
{
		r1.setRect(85,-13.5,30,30);
		path.addEllipse(r1);
}

void ProgressWidget::paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
                       QWidget *widget)
            {
		painter->save();
			painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
                painter->drawEllipse(0, 0, 200, 200);
                painter->restore();
                painter->fillPath( path, QBrush( Qt::green, Qt::SolidPattern ) );  
             }
QRectF ProgressWidget::boundingRect() const
            {
                qreal penWidth = 150;
                return QRectF(-10 - penWidth / 2, -10 - penWidth / 2,20 + penWidth / 2, 20 + penWidth / 2);
            }

To copy to clipboard, switch view to plain text mode 

class ProgressWidget:public QGraphicsItem
{
public:
	QRectF r1;
 
	 QPainterPath path;
 
 
	void paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
	                       QWidget *widget);
	QRectF boundingRect() const;
 
	ProgressWidget();
	~ProgressWidget();
};

class ProgressWidget:public QGraphicsItem
{
public:
	QRectF r1;

	 QPainterPath path;

	
	void paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
	                       QWidget *widget);
	QRectF boundingRect() const;

	ProgressWidget();
	~ProgressWidget();
};

To copy to clipboard, switch view to plain text mode 

[caduel]

well, how about adding a slot advance() to that widget, connect it to a QTimer;

advance() increments an internal counter (the angle of your circle) and calls update();

base the drawing (the position) of the circle on that angle.

HTH

[salmanmanekia]

your idea seems to be acceptable..but the problem here is the moving of the green circle in grey circle ...the question is how can i move it...for now i just want to move it...

[wysota]

QGraphicsItem::setPos() is used to move items around. But basically I don't know why you are doing this inside graphics view, unless of course this is a requirement. I would implement a simple custom widget and draw the circles in the paint event based on the current progress.

[salmanmanekia]

Ok,so what i understand is that,that this function of drawing two circles and moving can be easily done if i do it by QWidget instead of QGraphicsItem...
do i understand correctly...
but in my case i have a QGraphicsSCene in which i want to include the item ,thatswhy i consider it as an item..
also is there any chance of implementing the movement using the code in my first post...i have used a QPainterPath() there..i mean to ask that am i going in the wrong direction by using it...or i can also implement it that way...Thanks

[wysota]

Ok,so what i understand is that,that this function of drawing two circles and moving can be easily done if i do it by QWidget instead of QGraphicsItem...

You can do it using graphics view as well, but in this case it only complicates things without giving any benefit.

If you need graphics view, then implement your progress bar as a single item - this way it's the same as you would implement it as a widget.

[salmanmanekia]

If you need graphics view, then implement your progress bar as a single item - this way it's the same as you would implement it as a widget

actually i am implementing it as a single item as you can see in my code in first post ...or do u mean to say that i should consider both the green circle and grey circle as seperate items instead of using something like QPainterPath for the green circle ..
also

You can do it using graphics view as well, but in this case it only complicates things without giving any benefit.

can you please explain how it makes things easy if i use QWidget because i thought this hierarchy is good like QGraphicsView->Scene->Item....

[caduel]

no, you're not implementing it as a single item.
You are implementing an item that does half the work by itself but contains another item.

Wysota suggested to not use an item in your item, but do all the work in your item in paint().

Just reimplement paint() -you'd have to do that regardless whether you're implementing a QWidget or a QGraphicsViewItem- and paint both your big circle and the small one in it.
The small ones position depends on some progress measure.

HTH

[wysota]

Oh, one more thing - get rid of the painter path, you don't need it. Simply draw two or three ellipses.

[salmanmanekia]

no, you're not implementing it as a single item.

can you please put more light on it,because i still think that there is only one item..
also correct me if i am wrong that you are suggesting me to just simply draw two ellipses as
QGraphicsEllipseItem and then find some mechanism to move one ellipse over another in the paint() function...

The small ones position depends on some progress measure.

also any guide on 'SOME PROGRESS MEASURE '..
Thanks alot

[caduel]

I got the impression that the green circle was an item. Seems it is not. Sorry for the confusion.

I (we) merely suggested that you just draw 2 ellipses in paint().
Something like that (untried)

void ProgressWidget::paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
      QWidget *widget)
{
    painter->save();
    painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),
                 30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
     painter->drawEllipse(0, 0, 200, 200);
 
     // draw your progress marker (the circle) over it
     // rotate/translate painter so you don't have to do trigonometry
     painter->translate(100,100); // move origin to middle
     painter->rotate(...); // depending on your progress
     painter->translate(0,80); // move origin into your ellipse
     painter->setPen(QPen(QBrush(Qt::green,Qt::SolidPattern),
                 3,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
 
     painter->drawEllipse(0, 0, 20,20);
     painter->restore();
 }

void ProgressWidget::paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
      QWidget *widget)
{
    painter->save();
    painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),
                 30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
     painter->drawEllipse(0, 0, 200, 200);

     // draw your progress marker (the circle) over it
     // rotate/translate painter so you don't have to do trigonometry
     painter->translate(100,100); // move origin to middle
     painter->rotate(...); // depending on your progress
     painter->translate(0,80); // move origin into your ellipse
     painter->setPen(QPen(QBrush(Qt::green,Qt::SolidPattern),
                 3,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
    
     painter->drawEllipse(0, 0, 20,20);
     painter->restore();
 }

To copy to clipboard, switch view to plain text mode 

'SOME PROGRESS MEASURE':

• a counter that increases with your 'progress'
• I would suggest to use an int, ranged from 0-359; interpreted as the angle (see: rotate);
• with every advance, you increase (mod 360) this angle
• that way repeatedly advancing will make your little circle move round the ellipse

HTH

[salmanmanekia]

Thanks ..it seems you have left me with deciding how to rotate...Thanks AGAIN

[caduel]

not how to rotate, just to what angle.
QPainter::rotate etc do all the hard work for you. You just have to provide an angle.

See the AnalogClock example for the usage of rotate.

[salmanmanekia]

To be honest with you, i am realy surprised that few lines could do this thing..i thought i had to write some lengthy code...any ways the good part is that i did understand now how things works....
i had some question popping regarding QPainter and related to that ,so there they are
1,Initially as you know i was trying to use QGraphicsPathItem...can you tell me why PathItem is not suitable in my case and where should it be used ?
2,Also can you tell what difference does it make with save() and restore() method..
and last but not the least
..Thanks

[caduel]

1,Initially as you know i was trying to use QGraphicsPathItem...can you tell me why PathItem is not suitable in my case and where should it be used ?

Don't know. Probably it is not efficient or, for your simple need, overy complicated.

well

2,Also can you tell what difference does it make with save() and restore() method..

I have to guess a bit here...

basically you are passed a QPainter. Calling rotate() -amongst other things- you modifiy it.
So, either the code calling you, has to restore the painter to a know good state, or you have to. Otherwise the painting of other parts of the widget might use your (inappropriate) modifications to the QPainter.

If it is your responsibility, it is only done when necessary.

[salmanmanekia]

Thanks ..but i think my problem are not over yet...
i am trying to move green circle this way but it shows green circle on view everywhere else then the grey circle ....

painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
            painter->drawEllipse(0, 0, 200, 200);
            painter->setPen(QPen(QBrush(Qt::green,Qt::SolidPattern),15,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
 
            for(int i = 30; i< 120; i=i+30)
            {
            painter->translate(dx,dy);
            painter->rotate(i);
            painter->translate(0,91);
            painter->drawEllipse(0,0,15,15);
            }

painter->setPen(QPen(QBrush(Qt::gray,Qt::SolidPattern),30,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
            painter->drawEllipse(0, 0, 200, 200);
            painter->setPen(QPen(QBrush(Qt::green,Qt::SolidPattern),15,Qt::SolidLine,Qt::FlatCap,Qt::MiterJoin));
            
            for(int i = 30; i< 120; i=i+30)
            {
            painter->translate(dx,dy);
            painter->rotate(i);
            painter->translate(0,91);
            painter->drawEllipse(0,0,15,15);
            }

To copy to clipboard, switch view to plain text mode 

also i want the previous green circle to be removed as the new green circle draws itself to the next position ...and it should look like a progress ..as if green circle revolves around grey in a couple of second...i hope you understand..

[wysota]

You have to redraw the whole widget when the progress value changes and not draw all of the values at once

[salmanmanekia]

You have to redraw the whole widget when the progress value changes and not draw all of the values at once

aah..i am confused i have to draw the WHOLE widget and also not draw ALL values...whats this supposed to mean