IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Qt Discussion :

Dessiner une flèche dans un QCanvas ?


Sujet :

Qt

  1. #1
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut Dessiner une flèche dans un QCanvas ?
    Bonjour,

    Je développe une interface graphique sous Qt3.3 ...
    J'aurai besoin de dessiner une flèche pour relier des éléments graphiques...
    Donc je voudrai créer une classe qui dérive de la classe QCanvasRectangle (pour avoir la forme d'un rectangle) et dedans je voudrai utiliser la fonction drawShape() pour dessiner un trait + une flèche au bout ...

    Je ne sais pas comment m'y prendre...

    Aidez moi SVP !!!

    Merci beaucoup

  2. #2
    Membre averti Avatar de MacPro
    Profil pro
    Inscrit en
    Novembre 2007
    Messages
    367
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations forums :
    Inscription : Novembre 2007
    Messages : 367
    Points : 344
    Points
    344
    Par défaut
    ô, ben on dirait qu'on va avoir le même problème très bientôt !
    Moi je dois avoir d'un côté une liste d'éléments graphiques, disons des carrés, des triangles, des ronds et des losanges. Le but, est de constuire plus ou mois un graphcet. Il faut que je prenne les éléments de ma liste, que je les glisse dans une zone, puis que je les relie entre eux par des flèches.

    Pour t'aider, je pense que tu peux regarder dans les démos de Qt :

    http://qt.developpez.com/doc/4.3/gra...-diagramscene/
    Lorsque vous avez trouvé solution à votre problème, n'oubliez pas de cliquer en bas de la page
    Besoin d'un photographe de mariage : http://www.triangle-photo.fr

  3. #3
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    il est en Qt3...

  4. #4
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    Oui, je bosse sous Qt3.3 donc je ne peux pas faire tout ça ...
    Mais sinon, ça aurait été bon ... dommage
    ça ne devrait pas être si compliqué que ça ... je veux juste créer une flèche que je pourrai appeler comme une QCanvasLine en fait (en passant en paramètre x1,y1,x2,y2 ... les coordonnées des deux extrimités quoi)

    Personne n'a vraiment aucune idée ???

    Je galère ...

  5. #5
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    ton problème est de pouvoir faire plusieur flèche qui ne se rentre pas dedans et jolie à voir... C'est ce qui est difficile à faire. Il existe graphviz (peut être utilisé par doxygen) qui fait cela. Jamais testé et ce n'est pas en Qt.

    Faire une flèche bête c'est facile..... Si c'est cela, dit nous la ça cloche

  6. #6
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    Oui c'est ça, je voudrai juste faire une simple flèche ...

    En fait, sur un QCanvas, j'ai plusieurs carrés que je veux relier entre eux.
    Cependant, la relation entre eux est soit une simple ligne, soit une ligne fléchée (pour indiquer une direction).

    Donc je voudrais faire une classe qui me dessine une ligne avec une flèche au bout ... tout simplement... et que je puisse utiliser comme une ligne (avec les même paramètres) ...

    Je ne sais pas si je suis clair


    Merci

  7. #7
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    alors faut le faire à la main.en héritant de qcanvaspolygonalitem qui dessine une ligne + le dessin du bout de la flèche, ça doit pas être très dure....
    http://qt.developpez.com/doc/3.3/qcanvaspolygonalitem/

    Mais je ne connait pas Qcanvas... j'utilise Qt4
    As tu regardé un peu la doc de qt3 sur les canvas?
    http://qt.developpez.com/doc/3.3/canvas/

  8. #8
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    Faire la ligne, ça j'arrive
    Mais il faudrait que j'arrive à faire partir deux petits traits de l'extrémité de la ligne pour faire la flèche.
    Et il faudrait que ces deux traits aient le même angle par rapport à à la ligne... c'est ça qui n'est pas évident

  9. #9
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    On va dire que la flèche est composée d'un triangle au bout. Le sommet est facile à trouver car il s'agit des coordonnées du point d'extrémité de la ligne.
    Maintenant, Il faudrait que j'arrive à calculer les coordonnées des 2 autres sommets du triangle qui forment ma flèche...

    J'ai un ami qui m'a dit que je pourrai utiliser ma ligne principale comme vecteur...
    Ensuite, il faudrait que je le normalize.
    Je n'aurai plus qu'à multiplier par la longueur souhaitée pour mon triangle .
    Et appliquer un angle...

    Mais je ne sais pas trop comment m'y prendre

    ça pourrait faire un truc comme ça ...

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    L: la longueur des arrêtes de mon triangle
     
    d= [mon_vecteur.normalize()]*L
     
    //Calcul d'un sommet:
    x=d*(Cos de langle choisi)
    y=d*(Sin de langle choisi)
    Vois tu plus clair ???

  10. #10
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    il te manque un vecteur perpendiculaire a ta ligne.
    A et B deux point de la ligne et B est là ou tu veut ta flèche
    L : vecteur ligne normalisé (B-A)/norm(B-A)
    N : vecteur normale normalisé trouvé avec N*L =Nx*Lx+Ny*Ly =0

    tu trouve donc deux points:

    FinLigne-L+d*N

    FinLigne-L-d*N

    avec d une distance que tu choisi

  11. #11
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    oui exact , j'avais oublier de préciser le vecteur perpendiculaire...

    Je comprends à moitié ton raisonnement mais je suis incapable de le retranscrire en ligne de code .... pourrais tu m'aider stp ???

  12. #12
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    Citation Envoyé par nouncyr Voir le message
    Je comprends à moitié ton raisonnement
    qu'es ce que tu ne comprend pas?

  13. #13
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    L : vecteur ligne normalisé (B-A)/norm(B-A)
    En code C++, ça donne quoi???

    N : vecteur normale normalisé trouvé avec N*L =Nx*Lx+Ny*Ly =0
    Nx et Lx , ce sont quels points?
    Et en code C++, ça donne quoi ?


    FinLigne-L+d*N

    FinLigne-L-d*N
    FinLigne correspond à quoi? des coordonnées de points ???
    Et en code C++???


    Je sais , je suis un boulet mais je ne suis pas très calé ...

  14. #14
    yan
    yan est déconnecté
    Rédacteur
    Avatar de yan
    Homme Profil pro
    Ingénieur expert
    Inscrit en
    Mars 2004
    Messages
    10 033
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Ingénieur expert
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Mars 2004
    Messages : 10 033
    Points : 13 968
    Points
    13 968
    Par défaut
    voici un petit shema
    Images attachées Images attachées  

  15. #15
    Membre averti Avatar de MacPro
    Profil pro
    Inscrit en
    Novembre 2007
    Messages
    367
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations forums :
    Inscription : Novembre 2007
    Messages : 367
    Points : 344
    Points
    344
    Par défaut
    HUMM, il te faut alors une classe comme tu dis.
    Moi j'en vois bien une avec les membres suivants :

    Partir de la convention suivante :
    fleche verticale pointant vers le haut.

    float tilt; // angle que fais la flèche par rapport à l'horizontale
    float lineLength; // longeur de la ligne
    float arrowHeight; // hauteur de la pointe (hauteur du triangle)
    float baseWidth; // largeur de la base de la pointe

    QPoint lineStart; // point de départ
    QPoint lineStop; // point d'arrivée
    QPoint arrowTop; // le sommet de la pointe
    QPoint arrowLeft; // le sommet à gauche de la pointe
    QPoint arrowright; // le sommet à droite de la pointe

    QLine ligne; // la partie ligne de la flèche
    QPolygon arrow(3); // la pointe qui comporte trois sommets

    Ensuite, à priori, tu connais la position de la pointe (c'est là que tu veux pointer), ça te donne la position de arrowTop, donc tu fais :

    arrowTop.setX(taposition en x);
    arrowTop.setY(taposition en Y);

    Puis, il te faut ton angle, et à partir de cet angle et des longeurs lineLength,
    arrowHeight et baseWidth, tu vas calculer la position de tous les autres points, donc un peu de trigonometrie ça devrait aller.

    Un petit schéma pour t'aider :




    (la position (0,0) c'est el coin haut gauche de l'ecran).

    Connaissant la pointe, c'est facile de connaître la base de la ligne, sa position en x c'est arrowTop.x - C avec C = (lineLength+ arrowHeight)*cos(tilt) et en y c'est
    arrowTop.y = y + (lineLength+ arrowHeight)*sin(tilt)

    et ainsi de suite.

    Sinon, tu as d'autres solution,comme dessiner complement une fleche dans un bitmap ou png (png possède la transparence), puis te servir des méthodes comme rotate(...), setPos(...) et d'autres...

    j'oubliais, après que tout tes calculs sont faits, tu traces simplement :
    arrow.setPoint(0,arrowLeft);
    arrow.setPoint(1,arrowTop);
    arrow.setPoint(2, arrowRight);

    dans un QPainter painter tu fais painter.drawPolygon(arrow) et painter.drawLine(QLine(lineStart,lineStop));

    L'avantage, c'est que tu pourras même choisir la couleur de tout ce que tu veux, même du remplissage
    Lorsque vous avez trouvé solution à votre problème, n'oubliez pas de cliquer en bas de la page
    Besoin d'un photographe de mariage : http://www.triangle-photo.fr

  16. #16
    Membre averti Avatar de MacPro
    Profil pro
    Inscrit en
    Novembre 2007
    Messages
    367
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations forums :
    Inscription : Novembre 2007
    Messages : 367
    Points : 344
    Points
    344
    Par défaut
    J'étais sûr que le temps d'écrire mon post, y'en aurait 4 ou 5 similaires !
    Lorsque vous avez trouvé solution à votre problème, n'oubliez pas de cliquer en bas de la page
    Besoin d'un photographe de mariage : http://www.triangle-photo.fr

  17. #17
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    Je vais essayer de comprendre .... mais je ne garantis rien ...

    Sinon , je ne suis pas sur que la méthode rotate() existe sous Qt3.3 ... malheureusement

  18. #18
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    En fait, moi je voudrai que les points LineStop et ArrowTop soient les mêmes...
    Sinon pour l'angle, je voudrai que ça soit l'angle entre le trait de la flèche et la ligne de base ....

    J'ai aussi un peu de mal à retranscrire tout ça sous forme de code ...

  19. #19
    Membre averti Avatar de MacPro
    Profil pro
    Inscrit en
    Novembre 2007
    Messages
    367
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations forums :
    Inscription : Novembre 2007
    Messages : 367
    Points : 344
    Points
    344
    Par défaut
    toi ce que tu veux là c'est encore plus simple, ça te fait trois lignes à tracer.
    Le mieux, c'est que tu te contentes déjà de tracer la ligne et rien de plus. L'angle, on s'en fiche pas mal de savoir où il est, dans que tu t'es fixé un repère !

    tiens, regarde QLine propose encore pas mal de méthodes pour te simplifier encore la vie (dx(), dy(), translate() ...):

    http://qt.developpez.com/doc/4.4/qline/


    faut regarder si ça existe sur Qt 3.3
    Lorsque vous avez trouvé solution à votre problème, n'oubliez pas de cliquer en bas de la page
    Besoin d'un photographe de mariage : http://www.triangle-photo.fr

  20. #20
    Futur Membre du Club
    Inscrit en
    Juillet 2008
    Messages
    20
    Détails du profil
    Informations forums :
    Inscription : Juillet 2008
    Messages : 20
    Points : 7
    Points
    7
    Par défaut
    Connaissant la pointe, c'est facile de connaître la base de la ligne, sa position en x c'est arrowTop.x - C avec C = (lineLength+ arrowHeight)*cos(tilt) et en y c'est
    arrowTop.y = y + (lineLength+ arrowHeight)*sin(tilt)
    Je n'ai pas trop compris ça ...
    Pour connaitre la base la ligne, il me faudrait calculer les coordonnées des points arrowLeft et arrowRight... ,non ?

    En fait, en suivant ton exemple, moi ce que je voudrais , c'est juste de pouvoir calculer les coordonnées des points arrowLeft et arrowRight en fonction des coordonnées du point arrowTop (car ce sont justement les coordonnées x et y du point arrowTop qui seront passés en paramètres lors de la construction de mon objet). L'angle sera choisi initialement (par exemple un angle de 45 degrés).

    Comprends tu ?

+ Répondre à la discussion
Cette discussion est résolue.
Page 1 sur 2 12 DernièreDernière

Discussions similaires

  1. [Swing][Graphics2D] dessiner une flèche
    Par Galima dans le forum 2D
    Réponses: 13
    Dernier message: 04/12/2011, 00h31
  2. Dessiner une parabole dans un repère cartésien
    Par guynono dans le forum Graphisme
    Réponses: 4
    Dernier message: 06/07/2006, 12h33
  3. Réponses: 5
    Dernier message: 21/07/2005, 20h20
  4. Comment dessiner une ligne dans un Chart ?
    Par libititi dans le forum Composants VCL
    Réponses: 3
    Dernier message: 16/06/2005, 15h56
  5. Dessiner une ligne dans un cube transparent ?
    Par Muetdhiver dans le forum OpenGL
    Réponses: 4
    Dernier message: 04/05/2004, 12h06

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo