[Solved] Draw lines animation
-
!http://i.stack.imgur.com/TQnIx.gif(Draw Line Animation)!
Hi, I'm trying to create a drawing animation similar to the above, where it literally is drawing a line like using a pen. I've read the QAnimationFramework and at the moment I'm currently working on a solution by changing the coordinate of the QLineF by inherting QGraphicsLineItem to QObject then use QPropertyAnimation to animate it.
I'm a newbie so wondering if this is possible, or if you can suggest a direction for me would be awesome. Thanks very much! -
So I went with a QTimer approach, by connect timeout() with a slot called move() where it gradually increase the end point of the line:
myLine.h
@#ifndef MYLINE_H
#define MYLINE_H#include <QGraphicsLineItem>
class myLine : public QObject, public QGraphicsLineItem
{
Q_OBJECTpublic:
myLine();
QRectF boundingRect();
void paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget);private slots:
void mySlot();
private:
QLineF thisline;};
#endif // MYLINE_H
@
myLine.cpp
@#include "myLine.h"#include <QPainter>
#include <QApplication>myLine::myLine()
{
thisline.setLine(0,0,50,50);
}QRectF myLine::boundingRect()
{
return QRectF(0,0,500,500);
}void myLine::paint(QPainter *painter, const QStyleOptionGraphicsItem *option, QWidget *widget)
{
painter->setRenderHint(QPainter::Antialiasing);
painter->setPen(QPen(Qt::red, 8, Qt::SolidLine, Qt::RoundCap, Qt::MiterJoin));
painter->setBrush(QBrush(Qt::white, Qt::DiagCrossPattern));
painter->drawRect(boundingRect());
painter->drawLine(thisline);
}void myLine::mySlot()
{
for (int i = 1; i < 100; i++)
{
QLineF line = this->line();
line.setLine(0,0,50+i,50+i);
update();
qApp->processEvents();
}}
@
and main.cpp
@ scene = new QGraphicsScene(this);ui->graphicsView->setScene(scene); ui->graphicsView->setSceneRect(0,0,700,700); ui->graphicsView->setRenderHint(QPainter::Antialiasing); myLine *line = new myLine(); scene->addItem(line); timer = new QTimer(this); connect(timer, SIGNAL(timeout()), line, SLOT(mySlot())); timer->start(100);@
However it only draw a single line, there was no animation. I think there's a problem in the loop or SLOT so i would be very grateful can point this out for me. Thannks very much!
-
Hi and welcome to devnet,
You should not have a for loop in your slot rather each time your slot is called you increment your line coordinates and call update(). Also in your slot you are modifying a copy of the line without setting it after.
If I've read the documentation correctly you shouldn't even need to sub class QGraphicsLineItem. Just use it
Hope it helps
-
Hi, thanks very much for your reply.
Yes you're right, I didn't have to subclass QgraphicsLineItem so I removed it then use QPropertyAnimation to modifies the endpoint coordinate of the line and that does the job.
Cheers,
-
You're welcome !
Please update the thread's title to solved so other forum users may know a solution has been found :)