Déplacement d'image : dissocier les axes X et Y

Version imprimable

Bonjour,

J'utilise Qt depuis peu et je sèche sur un problème (jusqu'à présent j'ai pu m'en sortir grâce à la doc vraiment bien faite). Je n'arrive pas à utiliser setEasingCurve comme je le voudrais et à vrai dire, je ne sais même pas si c'est cette fonction qu'il me faut.

Mon problème :
Je cherche à déplacer une image (que j'ai collé dans un QLabel).
La vitesse de déplacement sur l'axe x doit être constante tandis que celle sur l'axe y doit être variable.

Ici, le "setEasingCurve(QEasingCurve::InOutSine);" applique une variation de vitesse identique sur les deux axes. Je n'arrive pas à dissocier les deux axes.

Voilà le bout de code concerné :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 QDialog *anim = new QDialog; anim->setWindowTitle("OK"); anim->setFixedSize(800,600); QLabel *diab = new QLabel(); diab->setPixmap(QPixmap("images/diabolo.png")); QPropertyAnimation *animation = new QPropertyAnimation(diab, "geometry"); animation->setDuration(3000); // trajet en l'air animation->setKeyValueAt(0,QRect(330, 350, 67, 67)); animation->setKeyValueAt(0.5,QRect(250, 50, 67, 67)); animation->setKeyValueAt(1,QRect(170, 350, 67, 67)); animation->setEasingCurve(QEasingCurve::InOutSine); animation->setLoopCount(-1); animation->start(); QVBoxLayout *layout = new QVBoxLayout(); layout->addWidget(diab); anim->setLayout(layout); anim->show();
Si quelqu'un a une idée. Là, je ne vois vraiment pas...

Merci d'avance

31/01/2012, 13h03
Troudhyl

Là tu animes le QRect (ce qui me semble compliqué à contrôler). Tu définis différentes étapes, mais une animation unique entre ces étapes.

Ce qu'il te faut, c'est utiliser une animation pour x et une pour y. Ensuite une classe pratique : QParallelAnimationGroup, pour exécuter deux animations simultanément.

Là du coup tu pourras définir pour chaque animation une "EasingCurve" distincte.

Bonjour et merci pour cette réponse.

Je ne connaissait pas QParallelAnimationGroup . Ça me sera aussi utile par la suite.

Voilà ce que j'ai essayé :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
 
        QDialog *anim = new QDialog;
        anim->setWindowTitle("OK");
        anim->setFixedSize(800,600);
 
        QLabel *diab = new QLabel();
        //diab->move(330,500);
        diab->setPixmap(QPixmap("images/diabolo.png"));
 
        QParallelAnimationGroup* animationXY = new QParallelAnimationGroup;
 
        QPropertyAnimation *animX = new QPropertyAnimation(diab, "x"); //
        animX->setDuration(1000);
        //animX->setStartValue(330);
        animX->setKeyValueAt(0,330);
        animX->setKeyValueAt(0.5,100);
        animX->setKeyValueAt(1,330);
        //animX->setEndValue(330);
        animX->setLoopCount(-1);
        animationXY->addAnimation(animX);
 
        QPropertyAnimation *animY = new QPropertyAnimation(diab, "y");
        animY->setDuration(1000);
       // animY->setStartValue(330);
        animY->setKeyValueAt(0,330);
        animY->setKeyValueAt(0.5,100);
        animY->setKeyValueAt(1,330);
        //animY->setEndValue(330);
        animY->setEasingCurve(QEasingCurve::InOutSine);
        animY->setLoopCount(-1);
        animationXY->addAnimation(animY);
 
        animationXY->start();
 
 
        QVBoxLayout *layout = new QVBoxLayout();
        layout->addWidget(diab);
        anim->setLayout(layout);
        anim->show();

La compilation se passe bien mais lors de l'exécution, ça me renvoi :

Code:

1
2
3
4
QPropertyAnimation: you're trying to animate the non-writable property x of your QObject
QPropertyAnimation: you're trying to animate the non-writable property y of your QObject
QPropertyAnimation: you're trying to animate the non-writable property x of your QObject
QPropertyAnimation: you're trying to animate the non-writable property y of your QObject

(mon image s'affiche mais pas de déplacement)

Si je comprend bien, les propriétés x et y de mon QLabel existent (trouvé dans la doc) mais je ne peux pas les modifier comme ça.

[edit] j'ai compris pourquoi j'ai ce message : je n'ai pas de setter mais seulement un getter pour ces deux propriétés. Mon problème reste entier...

Exact, ce sont des propriétés "const"... Je pense que tu peux t'en sortir avec la propriété "pos" (setter : move()) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
 
        QDialog *anim = new QDialog;
        anim->setWindowTitle("OK");
        anim->setFixedSize(800,600);
 
        QLabel *diab = new QLabel();
        //diab->move(330,500);
        diab->setPixmap(QPixmap("images/diabolo.png"));
 
        QParallelAnimationGroup* animationXY = new QParallelAnimationGroup;
 
        QPropertyAnimation *animX = new QPropertyAnimation(diab, "pos"); //
        animX->setDuration(1000);
        //animX->setStartValue(QPoint(330, diab->y()));
        animX->setKeyValueAt(0,QPoint(330, diab->y()));
        animX->setKeyValueAt(0.5,QPoint(100, diab->y()));
        animX->setKeyValueAt(1,QPoint(330, diab->y()));
        //animX->setEndValue(QPoint(330, diab->y()));
        animX->setLoopCount(-1);
        animationXY->addAnimation(animX);
 
        QPropertyAnimation *animY = new QPropertyAnimation(diab, "pos");
        animY->setDuration(1000);
       // animY->setStartValue(QPoint(diab->x(), 330));
        animY->setKeyValueAt(0,QPoint(diab->x(), 330));
        animY->setKeyValueAt(0.5,QPoint(diab->x(), 100));
        animY->setKeyValueAt(1,QPoint(diab->x(), 330));
        //animY->setEndValue(QPoint(diab->x(), 330));
        animY->setEasingCurve(QEasingCurve::InOutSine);
        animY->setLoopCount(-1);
        animationXY->addAnimation(animY);
 
        animationXY->start();
 
 
        QVBoxLayout *layout = new QVBoxLayout();
        layout->addWidget(diab);
        anim->setLayout(layout);
        anim->show();

J'ai tapé le code à la main ici, il y a peut-être des erreurs mais tu vois le principe ? Je ne suis pas sûr que ça marche par contre.

01/02/2012, 23h17
Invité

Malheureusement cela ne fonctionne pas mieux (image affichée mais reste figée). Que cela soit avec un QRect ou un QPoint, on manipule toujours x et y en même temps.

Je vais essayer de trouver un autre moyen pour arriver à mes fins. Il y a peut être d'autres fonctions plus adaptées.

En tout cas, merci.

J'ai essayé quelque chose qui fonctionne :

.h

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
#ifndef QMOVABLELABEL_H
#define QMOVABLELABEL_H
 
#include <QLabel>
 
class QMovableLabel : public QLabel
{
    Q_OBJECT
    Q_PROPERTY(int posX READ posX WRITE setPosX)
    Q_PROPERTY(int posY READ posY WRITE setPosY)
 
public:
    explicit QMovableLabel(QWidget *parent = 0);
 
    int posX() const;
    void setPosX(int);
 
    int posY() const;
    void setPosY(int);
};
 
#endif // QMOVABLELABEL_H

.cpp

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
#include "qmovablelabel.h"
 
QMovableLabel::QMovableLabel(QWidget *parent) :
    QLabel(parent)
{
}
 
int QMovableLabel::posX() const
{
    return x();
}
 
void QMovableLabel::setPosX(int i)
{
    move ( i, y() );
}
 
int QMovableLabel::posY() const
{
    return y();
}
 
void QMovableLabel::setPosY(int j)
{
    move ( x(), j );
}

Et pour l'animation, tu utilises les propriétés posX et posY qui sont "settables" cette fois :ccool:. Ça marche même sans "READ", bien que qmake signale que ce n'est pas possible... bizarre.

Merci beaucoup, ça fonctionne nickel et j'ai appris des choses en plus. :ccool:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
        QDialog *anim = new QDialog;
        anim->setWindowTitle("OK");
        anim->setFixedSize(800,600);
 
        QMovableLabel *diab = new QMovableLabel();
        diab->setPixmap(QPixmap("images/diabolo.png"));
 
        QParallelAnimationGroup* animationXY = new QParallelAnimationGroup;
 
        QPropertyAnimation *animX = new QPropertyAnimation(diab, "posX");
        animX->setDuration(4000);
        animX->setKeyValueAt(0,50);
        animX->setKeyValueAt(0.5,700);
        animX->setKeyValueAt(1,50);
        animX->setLoopCount(-1);
        animationXY->addAnimation(animX);
 
        QPropertyAnimation *animY = new QPropertyAnimation(diab, "posY");
        animY->setDuration(2000);
        animY->setKeyValueAt(0, 200);
        animY->setKeyValueAt(0.5, -200);
        animY->setKeyValueAt(1,200);
        animY->setLoopCount(-1);
        animY->setEasingCurve(QEasingCurve::OutInSine);
        animationXY->addAnimation(animY);
 
        animationXY->start();
 
 
        QVBoxLayout *layout = new QVBoxLayout();
        layout->addWidget(diab);
        anim->setLayout(layout);
        anim->show();