En C++, la programació de la interfície gràfica d'usuari (GUI) és important en el desenvolupament d'aplicacions modernes on els usuaris tenen bons gràfics per treballar. Tot i que C++ s'associa habitualment amb la programació del sistema i l'escriptura de jocs, pot ser una excel·lent alternativa a l'escriptura de GUI. En aquest article, parlarem de la programació GUI en C++, algunes biblioteques GUI populars per a C++ i com crear una aplicació GUI bàsica en C++.
Requisits previs: Fonaments de C++, C++ OOP, algunes biblioteques GUI.
Què és la GUI (Graphical User Interface)?
La interfície gràfica d'usuari (GUI) és una interfície d'aplicació visual que es proporciona mitjançant gràfics com finestres, quadres de text i botons mitjançant els quals els usuaris poden comunicar-se amb el programari. La GUI ofereix una plataforma interactiva i fàcil d'utilitzar en comparació amb la interfície de línia d'ordres (CLI), ja que els usuaris poden utilitzar el ratolí o altres dispositius d'entrada com ara una pantalla tàctil, etc. sense dependre només del teclat.
Conceptes principals de programació GUI
Una interfície gràfica d'usuari (GUI) implica dissenyar finestres, diàlegs, botons, etc., que són tots components interactius de la interfície d'usuari. A continuació, controlem aquests ginys mitjançant controladors d'esdeveniments com onClick, onHover, etc.
Els conceptes principals de la programació GUI són:
Ginys
Una interfície gràfica d'usuari (GUI) està formada per widgets. Per exemple, aquests inclouen botons, quadres de text, etiquetes, etc. Les propietats i comportaments de cada widget es poden personalitzar d'acord amb les necessitats específiques d'una aplicació. En general, hi ha els ginys següents en una biblioteca GUI:
- Finestra: Un marc de finestra de nivell superior que allotja altres ginys dins de si mateix.
- Botó: Un botó clicable que té algun esdeveniment associat al seu clic.
- Etiqueta: Text senzill de només lectura
- casella de selecció : Caixa que ofereix les opcions d'activació o desactivació.
- Botó de ràdio: Caixa que ofereix les opcions d'activació o desactivació però només podem triar un botó d'opció en un grup.
- Quadre desplegable/Combo : obre un menú desplegable quan es fa clic. Només es pot mostrar un element en el formulari no obert.
- Caixa de text: Àrea de text editable.
- Caixa de llista: El quadre amb diversos elements i una barra de desplaçament per recórrer tots ells.
- Control lliscant: Un giny de navegació utilitzat per moure's per l'aplicació.
- Menú: El menú que es mostra a la part superior ofereix diferents opcions per a l'usuari de l'aplicació.
- Caixa de diàleg: Un quadre que es mostra a la part superior d'una finestra. De vegades per mostrar la notificació.
- Quadrícula: S'utilitza per a la gestió del disseny de la interfície d'usuari.
Gestió de maquetació
Les aplicacions GUI s'han d'optimitzar per a diverses pantalles de diferents mides, resolucions, etc., la qual cosa busca mantenir una interfície d'usuari atractiva però eficaç amb els diferents ginys organitzats a la pantalla.
Gestió d'esdeveniments
En la programació de la GUI, els esdeveniments com els clics de botons o les pressions de tecles són crítics. Aquests esdeveniments són gestionats per l'aplicació per tal que pugui seguir les accions de l'usuari. Hi ha diferents esdeveniments associats amb diferents ginys. Per exemple, per a un botó en què es pot fer clic, els esdeveniments associats són:
- Feu clic a Esdeveniment
- Esdeveniment de moviment del ratolí
- Focus en l'esdeveniment
- Esdeveniment Focus Out
Biblioteques GUI populars per a C++
C++ té moltes biblioteques GUI independents de la plataforma que es poden utilitzar per desenvolupar una aplicació GUI. Alguns dels populars són:
- gtkmm
- Qt
- wxWidgets
- Benvolgut ImuGui
Exemple d'aplicació C++ GUI
Utilitzarem les eines següents per als programes següents:
- Biblioteca Qt : La biblioteca GUI del nostre programa.
- Qt Designer: Un dissenyador de plantilles GUI interactiu per a Qt.
- Qt Creator: IDE per a aplicacions GUI de Qt
Ara, veurem casos reals de programació GUI amb C++ i Qt. Anem a desenvolupar una aplicació bàsica de Hello World, un botó i quan es faci clic en el botó, apareixerà un quadre de diàleg amb el text Hello World escrit. Ho implementarem seguint aquests passos:
Pas 1: Creació d'un projecte Qt
Obrirem el Qt Creator i crearem un nou projecte de tipus Qt Widget Application. Introduïu el nom, seleccioneu la ubicació i ja esteu a punt. El creador de Qt crearà el projecte amb tots els fitxers necessaris.
Pas 2: Disseny de la finestra
Aleshores obrirem el fitxer mainWindow.ui . Aquest fitxer conté la interfície d'usuari de l'aplicació. Afegirem una etiqueta de text utilitzant el dissenyador que s'acaba d'obrir.
tuples java
Ara els nostres fitxers contindran el codi següent:
finestra 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> |
>
>
com cridar un mètode en java
main.cpp
C++
#include 'mainwindow.h'> > #include> > int> main(>int> argc,>char> *argv[])> {> >QApplication a(argc, argv);> >MainWindow w;> >w.show();> >return> a.exec();> }> |
>
>
iterador de mapes java
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;> }> |
>
>
ssh forma completa
mainWindow.ui
XML
xml version='1.0' encoding='UTF-8'?> |
>
>
Tingueu en compte que mainWindow.ui està escrit en XML. És perquè Qt escriu els seus fitxers d'IU en XML.
Pas 4: crear i executar
Podem construir i executar el projecte Qt a Qt creator amb un sol clic.
Sortida
Avantatges de les aplicacions GUI
Les aplicacions GUI ofereixen diversos avantatges, que contribueixen a una millor experiència d'usuari i un desenvolupament racionalitzat:
- Interfície fàcil d'utilitzar: L'ús d'interfícies gràfiques d'usuari (GUI) proporciona un enfocament senzill i fàcil d'utilitzar cap a les aplicacions de programari en comparació amb altres enfocaments que necessitarien més temps.
- Interactivitat millorada: Inclou funcions interactives com botons, menús desplegables, casella de selecció i control lliscant que donen als usuaris poder sobre les seves experiències.
- Compatibilitat entre plataformes: Els idiomes com Qt permeten la creació d'aplicacions GUI per a Windows, macOS, Linux amb C++.
- Prototips ràpids: La presència de molts constructors de GUI i eines de disseny als marcs de GUI promou la creació ràpida de prototips d'interfícies, fent que tot el procés de desenvolupament sigui més ràpid.