În C++, programarea interfeței grafice cu utilizatorul (GUI) este importantă în dezvoltarea de aplicații moderne, unde utilizatorii au o grafică frumoasă cu care să lucreze. Deși C++ este în mod obișnuit legat de programarea sistemului și scrierea jocurilor, poate fi o alternativă excelentă la scrierea GUI. În acest articol, vom discuta despre programarea GUI în C++, unele biblioteci GUI populare pentru C++ și cum să creați o aplicație GUI de bază în C++.
Cerințe preliminare: Fundamentele C++, C++ OOP, unele biblioteci GUI.
Ce este GUI (Graphical User Interface)?
Interfața grafică cu utilizatorul (GUI) este o interfață vizuală a aplicației care este furnizată folosind elemente grafice precum ferestre, casete de text și butoane prin care utilizatorii pot comunica cu software-ul. GUI oferă o platformă interactivă și ușor de utilizat în comparație cu Command Line Interface (CLI), deoarece utilizatorii pot folosi mouse-ul sau alte dispozitive de intrare, cum ar fi un ecran tactil etc., fără a se baza doar pe tastatură.
Concepte principale de programare GUI
O interfață grafică cu utilizatorul (GUI) implică proiectarea ferestrelor, dialogurilor, butoanelor etc., care sunt toate componente interactive ale interfeței cu utilizatorul. Apoi controlăm aceste widget-uri folosind handlere de evenimente precum onClick, onHover etc.
Principalele concepte ale programării GUI sunt:
Widgeturi
O interfață grafică cu utilizatorul (GUI) este alcătuită din widget-uri. De exemplu, acestea includ butoane, casete de text, etichete etc. Proprietățile și comportamentele fiecărui widget pot fi personalizate în conformitate cu nevoile specifice ale unei aplicații. Există, în general, următoarele widget-uri într-o bibliotecă GUI:
- Fereastră: Un cadru de fereastră de nivel superior care găzduiește alte widget-uri în interiorul său.
- Buton: Un buton pe care se poate face clic care are un eveniment asociat cu clicul său.
- Eticheta: Text simplu doar pentru citire
- Caseta de bifat : casetă care oferă opțiunile de activare sau dezactivare.
- Buton de radio: Casetă care oferă opțiunile de activare sau dezactivare, dar putem alege doar un singur buton radio dintr-un grup.
- Meniu/Combo Box : Deschide un meniu derulant atunci când se dă clic. Un singur articol poate fi afișat în formularul nedeschis.
- Casetă de text: Zona de text editabil.
- Listbox: Cutia cu mai multe articole și o bară de defilare pentru a le parcurge pe toate.
- Glisor: Un widget de navigare folosit pentru a vă deplasa prin aplicație.
- Meniul: Afișat în partea de sus, meniul oferă diferite opțiuni utilizatorului aplicației.
- Căsuță de dialog: O casetă care este afișată în partea de sus a unei ferestre. Uneori pentru a afișa notificarea.
- Grilă: Folosit pentru gestionarea aspectului UI.
Managementul aspectului
Aplicațiile GUI trebuie optimizate pentru diferite ecrane de diferite dimensiuni, rezoluții etc., ceea ce urmărește să păstreze o interfață de utilizator atractivă, dar eficientă, cu diferitele widget-uri organizate pe ecran.
Gestionarea evenimentelor
În programarea GUI, evenimentele precum clicurile pe butoane sau apăsările de taste sunt critice. Aceste evenimente sunt gestionate de aplicație pentru ca aceasta să poată urmări acțiunile utilizatorului. Există diferite evenimente asociate cu diferite widget-uri. De exemplu, pentru un buton pe care se poate face clic, evenimentele asociate sunt:
- Faceți clic pe Eveniment
- Eveniment de mutare a mouse-ului
- Focus în eveniment
- Evenimentul Focus Out
Biblioteci GUI populare pentru C++
C++ are multe biblioteci GUI independente de platformă care pot fi folosite pentru a dezvolta o aplicație GUI. Unele dintre cele populare sunt:
- gtkmm
- Qt
- wxWidgets
- Dragă ImuGui
Exemplu de aplicație C++ GUI
Vom folosi următoarele instrumente pentru programele de mai jos:
- Biblioteca Qt : Biblioteca GUI pentru programul nostru.
- Qt Designer: Un designer de șabloane GUI interactiv pentru Qt.
- Qt Creator: IDE pentru aplicații Qt GUI
Acum, ne vom uita la cazuri reale pentru programarea GUI cu C++ și Qt. Vom dezvolta o aplicație de bază Hello World, un buton și când se face clic pe butonul, va apărea o casetă de dialog cu textul Hello World scris pe ea. O vom implementa folosind acești pași:
Pasul 1: Crearea unui proiect Qt
Vom deschide Qt Creator și vom crea un nou proiect de tip Qt Widget Application. Introduceți numele, selectați locația și sunteți gata. Creatorul Qt va crea proiectul cu toate fișierele necesare.
Pasul 2: Proiectarea ferestrei
Vom deschide apoi fișierul mainWindow.ui . Acest fișier conține interfața de utilizare a aplicației. Vom adăuga o etichetă text folosind designerul care tocmai s-a deschis.
Acum fișierele noastre vor conține următorul cod:
fereastră principală.h
C++
#ifndef MAINWINDOW_H> #define MAINWINDOW_H> > #include> > QT_BEGIN_NAMESPACE> namespace> Ui {> class> MainWindow; }> QT_END_NAMESPACE> > class> MainWindow :> public> QMainWindow> {> > Q_OBJECT> > public> :> > MainWindow(QWidget *parent = nullptr);> > ~MainWindow();> > private> :> > Ui::MainWindow *ui;> };> #endif // MAINWINDOW_H> |
>
>
principal.cpp
C++
#include 'mainwindow.h'> > #include> > int> main(> int> argc,> char> *argv[])> {> > QApplication a(argc, argv);> > MainWindow w;> > w.show();> > return> a.exec();> }> |
>
>
mainWindow.cpp
C++
#include 'mainwindow.h'> #include './ui_mainwindow.h'> > MainWindow::MainWindow(QWidget *parent)> > : QMainWindow(parent)> > , ui(> new> Ui::MainWindow)> {> > ui->setupUi(> this> );> }> > MainWindow::~MainWindow()> {> > delete> ui;> }> |
>
>
mainWindow.ui
XML
xml version='1.0' encoding='UTF-8'?> |
matrice bash
>
>
Observați că mainWindow.ui este scris în XML. Se datorează faptului că Qt își scrie fișierele UI în XML.
Pasul 4: Construiți și rulați
Putem construi și rula proiectul Qt în Qt creator folosind un singur clic.
Ieșire
Avantajele aplicațiilor GUI
Aplicațiile GUI oferă mai multe avantaje, contribuind la o experiență mai bună a utilizatorului și la o dezvoltare simplificată:
- Interfață ușor de utilizat: Utilizarea interfețelor grafice cu utilizatorul (GUI) oferă o abordare simplă și ușor de utilizat față de aplicațiile software în comparație cu alte abordări care ar dura mai mult timp.
- Interactivitate îmbunătățită: Acesta cuprinde funcții interactive precum butoane, meniuri drop-down, casete de selectare și glisor, care oferă utilizatorilor putere asupra experiențelor lor.
- Compatibilitate între platforme: Limbile precum Qt permit crearea de aplicații GUI pentru Windows, macOS, Linux cu C++.
- Prototipuri rapide: Prezența multor constructori GUI și instrumente de proiectare în cadrele GUI promovează prototiparea rapidă a interfețelor, făcând întregul proces de dezvoltare mai rapid.