Exemple de menus

Un widget de menu peut être soit un menu déroulant dans une barre de menu, soit un menu contextuel autonome. Les menus déroulants sont affichés dans la barre de menus lorsque l'utilisateur clique sur l'élément correspondant ou appuie sur la touche de raccourci spécifiée. Les menus contextuels sont généralement invoqués par une touche spéciale du clavier ou par un clic droit.

Un menu consiste en une liste d'actions. Dans les applications, de nombreuses commandes courantes peuvent être invoquées via des menus, des boutons de la barre d'outils ou des raccourcis clavier. Étant donné que l'utilisateur s'attend à ce que les commandes soient exécutées de la même manière, quelle que soit l'interface utilisateur utilisée, il est utile de représenter chaque commande sous la forme d'une action.

L'exemple des menus consiste en une seule classe, MainWindow, dérivée de la classe QMainWindow. Lorsque l'on choisit l'un des éléments d'action dans notre application, celle-ci affiche le chemin de l'élément dans son widget central.

Définition de la classe MainWindow

QMainWindow La classe MainWindow fournit une fenêtre d'application principale, avec une barre de menu, des barres d'outils, des widgets d'ancrage et une barre d'état autour d'un grand widget central.

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow();

protected:
#ifndef QT_NO_CONTEXTMENU
    void contextMenuEvent(QContextMenuEvent *event) override;
#endif // QT_NO_CONTEXTMENU

Dans cet exemple, nous verrons comment mettre en œuvre des menus déroulants ainsi qu'un menu contextuel. Pour mettre en œuvre un menu contextuel personnalisé, nous devons réimplémenter la fonction contextMenuEvent() de QWidget afin de recevoir les événements du menu contextuel pour notre fenêtre principale.

private slots:
    void newFile();
    void open();
    void save();
    void print();
    void undo();
    void redo();
    void cut();
    void copy();
    void paste();
    void bold();
    void italic();
    void leftAlign();
    void rightAlign();
    void justify();
    void center();
    void setLineSpacing();
    void setParagraphSpacing();
    void about();
    void aboutQt();

Nous devons également implémenter une collection de slots privés pour répondre à l'activation par l'utilisateur de l'une de nos entrées de menu. Notez que ces slots sont laissés de côté dans cette documentation car ils sont triviaux, c'est-à-dire que la plupart d'entre eux ne font qu'afficher le chemin de l'action dans le widget central de la fenêtre principale.

private:
    void createActions();
    void createMenus();

Nous avons choisi de simplifier le constructeur en implémentant deux fonctions de commodité privées pour créer les différentes actions, les ajouter aux menus et insérer les menus dans la barre de menus de notre fenêtre principale.

    QMenu *fileMenu;
    QMenu *editMenu;
    QMenu *formatMenu;
    QMenu *helpMenu;
    QActionGroup *alignmentGroup;
    QAction *newAct;
    QAction *openAct;
    QAction *saveAct;
    QAction *printAct;
    QAction *exitAct;
    QAction *undoAct;
    QAction *redoAct;
    QAction *cutAct;
    QAction *copyAct;
    QAction *pasteAct;
    QAction *boldAct;
    QAction *italicAct;
    QAction *leftAlignAct;
    QAction *rightAlignAct;
    QAction *justifyAct;
    QAction *centerAct;
    QAction *setLineSpacingAct;
    QAction *setParagraphSpacingAct;
    QAction *aboutAct;
    QAction *aboutQtAct;
    QLabel *infoLabel;
};

Enfin, nous déclarons les différents menus et actions ainsi qu'une simple étiquette d'information dans la portée de l'application.

La classe QMenu fournit un widget de menu à utiliser dans les barres de menu, les menus contextuels et autres menus contextuels, tandis que la classe QAction fournit une action d'interface utilisateur abstraite pouvant être insérée dans les widgets.

Dans certaines situations, il est utile de regrouper des actions, par exemple, nous avons une action Left Align, une action Right Align, une action Justify et une action Center, et nous voulons qu'une seule de ces actions soit active à la fois. Une façon simple d'y parvenir est de regrouper les actions dans un groupe d'actions à l'aide de la classe QActionGroup.

Mise en œuvre de la classe MainWindow

Dans le constructeur, nous commençons par créer un QWidget ordinaire et en faisons le widget central de notre fenêtre principale. Notez que la fenêtre principale prend possession du pointeur du widget et le supprime au moment opportun.

MainWindow::MainWindow()
{
    QWidget *widget = new QWidget;
    setCentralWidget(widget);

    QWidget *topFiller = new QWidget;
    topFiller->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

    infoLabel = new QLabel(tr("<i>Choose a menu option, or right-click to "
                              "invoke a context menu</i>"));
    infoLabel->setFrameStyle(QFrame::StyledPanel | QFrame::Sunken);
    infoLabel->setAlignment(Qt::AlignCenter);

    QWidget *bottomFiller = new QWidget;
    bottomFiller->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);

    QVBoxLayout *layout = new QVBoxLayout;
    layout->setContentsMargins(5, 5, 5, 5);
    layout->addWidget(topFiller);
    layout->addWidget(infoLabel);
    layout->addWidget(bottomFiller);
    widget->setLayout(layout);

Nous créons ensuite l'étiquette d'information ainsi qu'un remplissage supérieur et inférieur que nous ajoutons à une disposition que nous installons sur le widget central. Les objets QMainWindow sont livrés avec leur propre disposition personnalisée et le fait de définir une disposition sur une fenêtre principale réelle, ou de créer une disposition avec une fenêtre principale en tant que parent, est considéré comme une erreur. Vous devez toujours définir votre propre disposition sur le widget central.

    createActions();
    createMenus();

    QString message = tr("A context menu is available by right-clicking");
    statusBar()->showMessage(message);

    setWindowTitle(tr("Menus"));
    setMinimumSize(160, 160);
    resize(480, 320);
}

Pour créer les actions et les menus, nous appelons nos deux fonctions de commodité : createActions() et createMenus(). Nous y reviendrons plus tard.

QMainWindowLa fonction statusBar() renvoie la barre d'état de la fenêtre principale (si la barre d'état n'existe pas, cette fonction créera et renverra une barre d'état vide). Nous initialisons la barre d'état et le titre de la fenêtre, redimensionnons la fenêtre à une taille appropriée et nous assurons que la fenêtre principale ne peut pas être redimensionnée à une taille inférieure à celle donnée.

Examinons maintenant de plus près la fonction de commodité createActions() qui crée les différentes actions :

void MainWindow::createActions()
{
    newAct = new QAction(QIcon::fromTheme(QIcon::ThemeIcon::DocumentNew),
                         tr("&New"), this);
    newAct->setShortcuts(QKeySequence::New);
    newAct->setStatusTip(tr("Create a new file"));
    connect(newAct, &QAction::triggered, this, &MainWindow::newFile);
    ...

Un objet QAction peut contenir une icône, un texte, un raccourci, une indication d'état, un texte "Qu'est-ce que c'est ? La plupart de ces éléments peuvent être définis dans le constructeur, mais ils peuvent également être définis indépendamment à l'aide des fonctions de commodité fournies.

Dans la fonction createActions(), nous créons d'abord une action newAct, en lui passant le texte et une icône utilisant l'une des constantes d'icône du thème. Nous faisons de Ctrl+N son raccourci à l'aide de la fonction QAction::setShortcut(), et nous définissons son indicateur d'état à l'aide de la fonction QAction::setStatusTip() (l'indicateur d'état est affiché sur toutes les barres d'état fournies par le widget parent de premier niveau de l'action). Nous connectons également son signal triggered() à l'emplacement newFile().

Les autres actions sont créées de la même manière. Veuillez consulter le code source pour plus de détails.

    alignmentGroup = new QActionGroup(this);
    alignmentGroup->addAction(leftAlignAct);
    alignmentGroup->addAction(rightAlignAct);
    alignmentGroup->addAction(justifyAct);
    alignmentGroup->addAction(centerAct);
    leftAlignAct->setChecked(true);
}

Une fois que nous avons créé les actions Left Align, Right Align, Justify et Center, nous pouvons également créer le groupe d'actions mentionné précédemment.

Chaque action est ajoutée au groupe à l'aide de la fonction addAction() de QActionGroup. Notez qu'une action peut également être ajoutée à un groupe en la créant avec le groupe comme parent. Étant donné qu'un groupe d'actions est exclusif par défaut, seule une des actions du groupe est vérifiée à un moment donné (ceci peut être modifié à l'aide de la fonction QActionGroup::setExclusive()).

Lorsque toutes les actions sont créées, nous utilisons la fonction createMenus() pour ajouter les actions aux menus et pour insérer les menus dans la barre de menus :

void MainWindow::createMenus()
{
    fileMenu = menuBar()->addMenu(tr("&File"));
    fileMenu->addAction(newAct);
    fileMenu->addAction(openAct);
    fileMenu->addAction(saveAct);
    fileMenu->addAction(printAct);
    fileMenu->addSeparator();
    fileMenu->addAction(exitAct);

    editMenu = menuBar()->addMenu(tr("&Edit"));
    editMenu->addAction(undoAct);
    editMenu->addAction(redoAct);
    editMenu->addSeparator();
    editMenu->addAction(cutAct);
    editMenu->addAction(copyAct);
    editMenu->addAction(pasteAct);
    editMenu->addSeparator();

    helpMenu = menuBar()->addMenu(tr("&Help"));
    helpMenu->addAction(aboutAct);
    helpMenu->addAction(aboutQtAct);

QMenuBarLa fonction addMenu() de QMenu ajoute un nouveau avec le titre donné, à la barre de menu (notez que la barre de menu prend la propriété du menu). Nous utilisons la fonction addAction() de QWidget pour ajouter chaque action au menu correspondant.

La classe QMenu propose également plusieurs fonctions de commodité addAction() qui créent et ajoutent de nouvelles actions à partir de textes et/ou d'icônes donnés. Vous pouvez également fournir un membre qui se connectera automatiquement au signal triggered() de la nouvelle action, ainsi qu'un raccourci représenté par une instance QKeySequence.

La fonction QMenu::addSeparator() crée et renvoie une nouvelle action séparatrice, c'est-à-dire une action pour laquelle QAction::isSeparator() renvoie true, et ajoute la nouvelle action à la liste des actions du menu.

    formatMenu = editMenu->addMenu(tr("&Format"));
    formatMenu->addAction(boldAct);
    formatMenu->addAction(italicAct);
    formatMenu->addSeparator()->setText(tr("Alignment"));
    formatMenu->addAction(leftAlignAct);
    formatMenu->addAction(rightAlignAct);
    formatMenu->addAction(justifyAct);
    formatMenu->addAction(centerAct);
    formatMenu->addSeparator();
    formatMenu->addAction(setLineSpacingAct);
    formatMenu->addAction(setParagraphSpacingAct);
}

Notez le menu Format. Tout d'abord, il est ajouté en tant que sous-menu au menu Edit à l'aide de la fonction addMenu() de QMenu. Deuxièmement, examinez les actions d'alignement : Dans la fonction createActions(), nous avons ajouté les actions leftAlignAct, rightAlignAct, justifyAct et centerAct à un groupe d'actions. Néanmoins, nous devons ajouter chaque action au menu séparément pendant que le groupe d'actions fait sa magie derrière la scène.

#ifndef QT_NO_CONTEXTMENU
void MainWindow::contextMenuEvent(QContextMenuEvent *event)
{
    QMenu menu(this);
    menu.addAction(cutAct);
    menu.addAction(copyAct);
    menu.addAction(pasteAct);
    menu.exec(event->globalPos());
}
#endif // QT_NO_CONTEXTMENU

Pour fournir un menu contextuel personnalisé, nous devons réimplémenter la fonction contextMenuEvent() de QWidget afin de recevoir les événements du menu contextuel du widget (notez que l'implémentation par défaut ignore simplement ces événements).

Chaque fois que nous recevons un tel événement, nous créons un menu contenant les actions Cut, Copy et Paste. Les menus contextuels peuvent être exécutés soit de manière asynchrone à l'aide de la fonction popup(), soit de manière synchrone à l'aide de la fonction exec(). Dans cet exemple, nous avons choisi d'afficher le menu à l'aide de la fonction exec(). En passant la position de l'événement comme argument, nous nous assurons que le menu contextuel apparaît à la position prévue.

Exemple de projet @ code.qt.io