Projet C++ 2A AU 2025-2026
Guide d’intégration
Table des matières
1. Création du projet SmartMarket ...................................................................................................... 1
2. Préparer l’UI unique........................................................................................................................... 1
3. Créer les slots directement via Qt Designer ...................................................................................... 2
4. Navigation entre pages........................................................................................................................ 2
5. Bonnes pratiques ................................................................................................................................. 3
6. Résultat attendu .................................................................................................................................. 3
7. Remarque importante......................................................................................................................... 3
À ce stade, nous allons nous concentrer exclusivement sur l’intégration des interfaces graphiques,
correspondant à la couche Vue/Contrôleur. Nous ne travaillerons donc que sur la classe d’interface
graphique (.UI) dans Qt.
1. Création du projet SmartMarket
Le projet SmartMarket va contenir tous les modules : exemple Employé et Client.
N.B : Il faut donner des noms d’objets significatifs à tous les widgets pour éviter de renommer lors de
l’intégration.
Exemple : btnAjouterEmploye, txtNomClient, tblProduit,stackedWidgetEmpl …
2. Préparer l’UI unique
1. Ouvrir [Link]
2. Ajouter QStackedWidget dans le centralWidget
3. Créer une page par module : (Chaque étudiant suivra le même processus pour intégrer son
interface)
• Page 0 → Module Employé (renomme la page PEmpl)
• Page 1 → Module Client (renomme la page PClient)
4. Copier-coller les widgets de chaque module dans la page correspondante
Les pages des différents modules deviennent donc des sous-pages du stackedWidget principal
SOUMAYA ARGOUBI 1
Projet C++ 2A AU 2025-2026
Exemple : Module Employé
• StackedWidget Employé (SMEmpl) (placé dans la page d’index 0) du stackedWidget SmartMarket)
o Page 0 → Login Employé
o Page 1 → Menu de l’application
✓ Bouton MEmpl → renvoie vers page d’index 3 du stackedWidget Employé (CRUD
Employé)
✓ Bouton MClient → renvoie vers page d’index 1 du stackedWidget SmartMarket (page
Client)
✓ Bouton Quitter → retourne à la page login (0) du module Employé
o Page 2 → Mot de passe oublié
o Page 3 → CRUD et fonctionnalités métier basique du module Employé
Même principe pour le module Client ou autre : chaque module a son stackedWidget interne et ses pages
logiques.
3. Créer les slots directement via Qt Designer
• Expl : bouton MEmpl -> void SmartMarket::on_MEmpl_clicked()
• Copier-coller le code des anciens modules
1. Ouvrir le projet de l’étudiant contenant son module (Employe, Client …)
2. Copier les slots existants depuis le projet de l’étudiant ([Link]&.h) dans les
fichiers [Link] et SmartMarket.h du nouveau projet contenant l’intégration des
interfaces.
3. Adapter les noms des objets si nécessaire (mais si tu as utilisé des noms significatifs, aucune
modification n’est nécessaire)
Les boutons internes des modules (CRUD, recherche, statistiques…) restent fonctionnels
4. Navigation entre pages
• Prévoir dans le menu principal des boutons permettant de naviguer entre les différentes pages
(par exemple un bouton MClient).
• Les boutons de navigation entre les pages du stackedWidget propres à chaque module doivent
être créés en amont par chaque étudiant dans son projet local.
• Lors de l’intégration dans SmartMarket, l’étudiant n’aura qu’à copier-coller le code des slots
correspondants.
• Nouveau bouton ➔ Double-cliquer → Qt crée le slot automatiquement :
SOUMAYA ARGOUBI 2
Projet C++ 2A AU 2025-2026
void SmartMarket::on_Newbtn_clicked()
{
ui->SWSmartMarket->setCurrentIndex(1); // Qt Designer a créé le slot
}
5. Bonnes pratiques
1. Noms d’objets significatifs dans le UI pour éviter de les renommer lors de l’intégration.
2. Copier le code des anciens modules directement dans les fichiers [Link] et
SmartMarket.h
3. Chaque page du stackedWidget contient tous les widgets d’un module
4. Navigation fluide : chaque bouton renvoie vers la page appropriée du stackedWidget
correspondant
5. Ajout futur de modules :
- Ajouter un bouton pour chaque module dans le menu pour y accéder
- Créer le slot associé pour la navigation
- Retour / Quitter : prévoir un bouton dans chaque module pour revenir à la page requise
ou fermer l’application
6. Testez chaque page individuellement avant de tester la navigation complète
6. Résultat attendu
• Un seul UI : [Link].
• Chaque module est une page du stackedWidget Smart Market.
• Navigation fluide entre pages et modules via les boutons.
• Possibilité d’ajouter de nouveaux modules sans restructurer le projet.
7. Remarque importante
Qt permet de connecter automatiquement des signaux et des slots si le slot suit une convention de
nommage du type : on_<objectName>_<signalName>()
Exemple : void on_pushButton_clicked();
Qt connecte automatiquement ce slot au signal clicked() du bouton nommé pushButton.
Dans les fichiers .h, Clazy signale que cette pratique (on-foo_bar) est source d’erreurs (slots named
onfoo_bar are error prone [clazy-connect-by-name]), pour plusieurs raisons :
1. Connexion implicite : ça repose sur (connectSlotsByName) qui se base sur des noms. Une faute
de frappe et ton slot ne sera jamais appelé, sans erreur visible.
SOUMAYA ARGOUBI 3
Projet C++ 2A AU 2025-2026
2. Lisibilité : on ne voit pas dans le code qu’un connect() a été fait. Ça rend la maintenance plus
difficile.
3. Performance : lors de l’exécution, Qt doit faire une recherche par introspection pour trouver le
slot correspondant.
Il y a donc 2 façons possible dans Qt :
1. Méthode “ancienne” (auto-slot via Designer) : Très rapide
• Tu fais clic droit → Go to slot…
• Qt génère une méthode on_monBouton_clicked().
• Qt appelle cette méthode automatiquement grâce à la convention de nommage.
➔ Rapide mais fragile et peu lisible → d’où le warning Clazy.
2. Méthode moderne (connect explicite) : Nécessite d’écrire le connect() manuellement
• Tu écris toi-même dans ton constructeur (après ui->setupUi(this);) :
connect(ui->monBouton, &QPushButton::clicked, this, MaFenetre::maFonction);
• Tu définis maFonction() comme un slot normal (peu importe le nom).
➔ Plus clair, robuste, recommandé.
Bien que la deuxième méthode soit la plus recommandée, car plus robuste et facile à maintenir, nous
avons choisi d’utiliser la première afin de gagner en rapidité pour la programmation de la navigation
et de rester cohérents avec l’atelier d’initiation à Qt déjà partagé. Ce guide présente un exemple de
mise en œuvre possible, mais toute autre méthode correcte et validée par le tuteur reste acceptable.
Dans ce cas, certaines étapes d’intégration pourront être légèrement différentes.
SOUMAYA ARGOUBI 4