[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_OBJECT

    public:
    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!


  • Lifetime Qt Champion

    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,


  • Lifetime Qt Champion

    You're welcome !

    Please update the thread's title to solved so other forum users may know a solution has been found :)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.