Partage
  • Partager sur Facebook
  • Partager sur Twitter

Création d'un widget Qtoolbar

pour gérer l'affichage contextuel du widget central

    28 septembre 2021 à 15:50:40

    Bonjour,
    Je cherche à coder une barre gauche verticale contenant des images. l'appui sur une image de cette barre générant l'affichage d'un widget différent dans la partie centrale de l'application.
    Un peu comme la barre gauche que l'on trouve sur Qt creator :
    Je n'ai pas trouvé de widget déjà existant pour cet élément. 
    Du coup, pour le moment, je suis parti sur l'idée d'une QToolBar contenant des QLabel.
    Est ce que cette conception semble judicieuse ? y a t'il des widget plus pertinent pour réaliser cet élément ?
    Pour le moment, j'ai du mal à gérer un affichage correct des images dans le widget. J'ai essayé différentes solutions pour les dimensionner correctement mais sans succès.
    il me reste aussi à coder la gestion des actions sur des clicks souris afin de faire afficher le bon widget au centre de mon application.
    le code :
    gestion des QLabel .h:
    #ifndef ELEMTOOLBAR_H
    #define ELEMTOOLBAR_H
    
    #include <QtDebug>
    #include <QWidget>
    #include <QVBoxLayout>
    #include <QToolBar>
    #include <QIcon>
    #include <QLabel>
    #include <QSize>
    #include <QPixmap>
    #include <QImage>
    
    class ElemToolBar : public QWidget
    {
        Q_OBJECT
    public:
        ElemToolBar(QString, QWidget *parent=0);
    
    
    private:
        QLabel *lblToolBar;
        QSize *imageSize;
        QImage *imageToDisplay;
        QPixmap *pixmapToDisplay;
    };
    
    #endif // ELEMTOOLBAR_H
    le .cpp associé :
    #include "elemtoolbar.h"
    
    ElemToolBar::ElemToolBar(QString iconFilePath,QWidget *parent) : QWidget(parent)
    {
        lblToolBar = new QLabel("Test");
        //lblToolBar->adjustSize();
        imageSize = new QSize(200,200);
        pixmapToDisplay = new QPixmap(*imageSize);
        imageToDisplay = new QImage(iconFilePath);
        pixmapToDisplay->fromImage(*imageToDisplay);
        pixmapToDisplay->scaled(200,200);
        //lblToolBar->setPixmap(*pixmapToDisplay);
        lblToolBar->setPixmap(QPixmap(iconFilePath).scaled(100,100));
        imageSize = new QSize(100,100);
        lblToolBar->setMaximumSize(*imageSize);
        lblToolBar->isVisible();
    
        QVBoxLayout *velayout = new QVBoxLayout(this);
        velayout->addWidget(lblToolBar);
    }
    le .h du widget ToolBar :
    #ifndef LEFTTABWIDGET_H
    #define LEFTTABWIDGET_H
    
    
    #include <QtDebug>
    #include <QWidget>
    #include <QVBoxLayout>
    #include <QToolBar>
    #include <QIcon>
    #include "elemtoolbar.h"
    
    class lefttabwidget : public QWidget
    {
        Q_OBJECT
    public:
        lefttabwidget(QWidget *parent=0);
    
    
    private:
        QToolBar *LeftToolBar;
        ElemToolBar *Elem1;
        ElemToolBar *Elem2;
        ElemToolBar *Elem3;
        ElemToolBar *Elem4;
    };
    
    #endif // LEFTTABWIDGET_H
    et le .cpp associé:
    #include "lefttabwidget.h"
    
    
    lefttabwidget::lefttabwidget(QWidget *parent) : QWidget(parent)
    {
        // définition des éléments QIcon
        Elem1 = new ElemToolBar("C:\\Dev\\Jigsaw_v2_proto2\\Ressources\\train.ico");
        Elem2 = new ElemToolBar("C:\\Dev\\Jigsaw_v2_proto2\\Ressources\\database.ico");
        Elem3 = new ElemToolBar("C:\\Dev\\Jigsaw_v2_proto2\\Ressources\\SPPDemo.png");
        Elem4 = new ElemToolBar("C:\\Dev\\Jigsaw_v2_proto2\\Ressources\\G1.jpg");
    
        LeftToolBar = new QToolBar();
        LeftToolBar->addWidget(Elem1);
        LeftToolBar->addSeparator();
        LeftToolBar->addWidget(Elem2);
        LeftToolBar->addSeparator();
        LeftToolBar->addWidget(Elem3);
        LeftToolBar->addSeparator();
        LeftToolBar->addWidget(Elem4);
        LeftToolBar->addSeparator();
    
        //QMainWindow::addToolBar ou QMainWindow::insertToolBar
        LeftToolBar->setOrientation(Qt::Vertical);
    
        QVBoxLayout *vtlayout = new QVBoxLayout(this);
        vtlayout->addWidget(LeftToolBar);
    }
    Est-il possible de forcer un dimensionnement automatique des images pour que tous les éléments de la tool bar soit visible dans la fenêtre de l'application ? 
    Merci pour vos conseils :-)
    • Partager sur Facebook
    • Partager sur Twitter
      28 septembre 2021 à 17:17:16

      Salut, je n'ai pas trop regardé ton code parce que vu ce que tu veux faire je pense que t'es en train de réinventer la roue 

      Plutôt que de recréer ta propre toolBar utilise la toolBar proposée par QMainWindow

      Via Qt Designer c'est extrêmement simple, tu créés une classe graphique de type QMainWindow, tu auras une toolBar vide placée en haut par défaut, tu n'as qu'à faire un glissé / déposé de cette toolBar sur n'importe quel bord de ta MainWindow et elle se placera à gauche comme tu le souhaites

      Ensuite pour les images, tu utilises un fichier ressource pour stocker les images que tu veux, dans Qt Designer tu utilises l'éditeur d'action en bas pour facilement créer des QAction et leur associé une image, un raccourci clavier, les positionner dans ta toolBar, les nommer, ...

      Dans ton code tu n'as ensuite plus qu'à connecter le signal triggered de chacun de tes QAction à un slot que tu auras toi même codé. Ce slot peut tout à fait se contenter d'appeller le constructeur d'une nouvelle fenêtre 

       ------------------------------------------------------------------------------------------

      EDIT : Si tu veux vraiment afficher un petit label en dessous de l'image dans ta toolBar

      Dabs l'éditeur d'action tu peux associer un texte à chacune de tes actions, par défaut ce texte est caché et il n'y a que l'image qui est affiché dans la toolBar.

      Ajoute simplement la ligne suivante dans le constructeur de la MainWindow 

      ui->toolBar->setToolButtonStyle( Qt::ToolButtonTextUnderIcon );

      Le texte s'affichera alors juste en dessous de l'image associée

      -
      Edité par ThibaultVnt 28 septembre 2021 à 17:24:48

      • Partager sur Facebook
      • Partager sur Twitter

      Création d'un widget Qtoolbar

      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
      • Editeur
      • Markdown