miércoles, 17 de diciembre de 2014

Mover objetos con transiciones en Qt con QPropertyAnimation

Aqui explicaremos como mover un objeto de Qt de un lugar a otro de la pantalla y que este se valla deslizando:
Basta con crear una animación de movimiento con QPropertyAnimation.


// Se crea la animación 
// el parámetro OBJETO es el objeto que queremos mover
// Puede ser un QLabel, QGraphicsWidget, etc
QPropertyAnimation *animation = new QPropertyAnimation(OBJETO, "pos"); 


// Duración de la animación. El tiempo desde que sale hasta que llega
animation->setDuration(1000); 

// Posición inicial de donde va a partir
animation->setStartValue(QPointF(this->x(), this->y()));

// Posición final a donde va a llegar
// En este caso le estoy diciendo que se mantenga en el mismo
// valor de x pero que varie el valor de Y en 100 px
animation->setEndValue(QPointF(this->x(), this->y()+100));

// Inicia la animación
animation->start(QAbstractAnimation::DeleteWhenStopped);


Este es un ejemplo compilable:

#include <QtCore>
#include <QtWidgets>
#include <QObject>
#include <QCoreApplication>

/** @brief Representa una figura cuadrada **/
class Cuadrado : public QGraphicsWidget
{
public:

    /** Constructor
     *  @param colorDeseado Color que el usuario desea
     *         Puede ser "azul" o "rojo". En caso contrario
     *         la pieza se dibujará gris
     **/
    Cuadrado(QString colorDeseado):QGraphicsWidget(){

        // Asigna el color segun el color deseado
        color= colorDeseado=="rojo"? Qt::red : (colorDeseado=="azul"?
               Qt::blue : Qt::gray);
    }

    ~Cuadrado(){}

    /** Pinta la pieza segun el color **/
    void paint(QPainter *painter, const QStyleOptionGraphicsItem *, 
               QWidget *){
        painter->fillRect(rect(), color);
    }

    void mover(qreal xEnd,qreal yEnd){
 // Aqui crea la animación
        QPropertyAnimation *animation = new QPropertyAnimation(this
                                                               "pos"); 
        animation->setDuration(8000); // 8 Segundos
        animation->setStartValue(QPointF(this->x(), this->y()));
        animation->setEndValue(QPointF(xEnd, yEnd));
        animation->start(QAbstractAnimation::DeleteWhenStopped);
    }

private:

    /** Color del cuadrado **/
    Qt::GlobalColor color;
};


int main(int argc, char **argv)
{ 
    QApplication app(argc, argv);

    // Creamos un cuadro rojo y uno azul
    Cuadrado *cuadroAzul=new Cuadrado("azul");
    Cuadrado *cuadroRojo=new Cuadrado("rojo");

    // Los movemos a la posición inicial
    cuadroAzul->moveBy(60,10);
    cuadroRojo->moveBy(10,10);

    // Se crea la escena
    QGraphicsScene scene(0, 0,600, 600);

    // Se agrega los cuadros a la escena
    scene.addItem(cuadroAzul);
    scene.addItem(cuadroRojo);

   // Se mueve con animación
    cuadroAzul->mover(200,500);
    cuadroRojo->mover(100,500);

    QGraphicsView window(&scene);
    window.show();
    return app.exec();
}




2 comentarios: