logo

Einführung in die GUI-Programmierung in C++

In C++ ist die Programmierung einer grafischen Benutzeroberfläche (GUI) in der modernen Anwendungsentwicklung wichtig, da den Benutzern schöne Grafiken zur Verfügung stehen, mit denen sie arbeiten können. Obwohl C++ häufig mit Systemprogrammierung und dem Schreiben von Spielen verknüpft ist, kann es eine hervorragende Alternative zum Schreiben von GUIs sein. In diesem Artikel besprechen wir die GUI-Programmierung in C++, einige beliebte GUI-Bibliotheken für C++ und die Erstellung einer einfachen GUI-Anwendung in C++.

Voraussetzungen: Grundlagen von C++, C++-OOPs, einige GUI-Bibliotheken.



Was ist GUI (Graphical User Interface)?

Die grafische Benutzeroberfläche (GUI) ist eine visuelle Anwendungsoberfläche, die mithilfe von Grafiken wie Fenstern, Textfeldern und Schaltflächen bereitgestellt wird, über die Benutzer mit der Software kommunizieren können. GUI bietet im Vergleich zur Command Line Interface (CLI) eine interaktive und benutzerfreundliche Plattform, da Benutzer die Maus oder andere Eingabegeräte wie einen Touchscreen usw. verwenden können, ohne sich nur auf die Tastatur verlassen zu müssen.

Hauptkonzepte der GUI-Programmierung

Eine grafische Benutzeroberfläche (GUI) umfasst die Gestaltung von Fenstern, Dialogen, Schaltflächen usw., die alle interaktive Benutzeroberflächenkomponenten sind. Dann steuern wir diese Widgets mithilfe von Ereignishandlern wie onClick, onHover usw.

Die Hauptkonzepte der GUI-Programmierung sind:



Widgets

Eine grafische Benutzeroberfläche (GUI) besteht aus Widgets. Dazu gehören beispielsweise Schaltflächen, Textfelder, Beschriftungen usw. Eigenschaften und Verhalten jedes Widgets können entsprechend den spezifischen Anforderungen einer Anwendung angepasst werden. Im Allgemeinen gibt es in einer GUI-Bibliothek die folgenden Widgets:

  1. Fenster: Ein Fensterrahmen der obersten Ebene, der andere Widgets in sich beherbergt.
  2. Taste: Eine anklickbare Schaltfläche, deren Klick mit einem Ereignis verknüpft ist.
  3. Etikett: Einfacher schreibgeschützter Text
  4. Kontrollkästchen : Feld, das die Optionen zum Ein- und Ausschalten bietet.
  5. Radio knopf: Feld, das die Optionen zum Ein- und Ausschalten bietet, wir können jedoch nur ein Optionsfeld in einer Gruppe auswählen.
  6. Dropdown-/Kombinationsfeld : Öffnet beim Klicken ein Dropdown-Menü. Im nicht geöffneten Formular kann nur ein Artikel angezeigt werden.
  7. Textfeld: Bearbeitbarer Textbereich.
  8. Listbox: Das Feld mit mehreren Elementen und einer Bildlaufleiste, um durch alle Elemente zu navigieren.
  9. Schieberegler: Ein Navigations-Widget, mit dem Sie sich in der Anwendung bewegen können.
  10. Speisekarte: Das oben angezeigte Menü bietet dem Anwendungsbenutzer verschiedene Optionen.
  11. Dialogbox: Ein Feld, das oben in einem Fenster angezeigt wird. Manchmal, um die Benachrichtigung anzuzeigen.
  12. Netz: Wird für die Layoutverwaltung der Benutzeroberfläche verwendet.

Layout-Management

Die GUI-Anwendungen müssen für verschiedene Bildschirme unterschiedlicher Größe, Auflösung usw. optimiert werden, um eine attraktive, aber effektive Benutzeroberfläche mit den verschiedenen auf dem Bildschirm organisierten Widgets beizubehalten.

Name von

Handhabung des Events

Bei der GUI-Programmierung sind Ereignisse wie Tastenklicks oder Tastendrücke von entscheidender Bedeutung. Diese Ereignisse werden von der App verarbeitet, damit sie den Benutzeraktionen folgen kann. Verschiedenen Widgets sind unterschiedliche Ereignisse zugeordnet. Für eine anklickbare Schaltfläche lauten die zugehörigen Ereignisse beispielsweise:



  1. Klicken Sie auf Ereignis
  2. Mausbewegungsereignis
  3. Fokus auf das Ereignis
  4. Focus Out-Ereignis

Beliebte GUI-Bibliotheken für C++

C++ verfügt über viele plattformunabhängige GUI-Bibliotheken, die zum Entwickeln einer GUI-Anwendung verwendet werden können. Einige der beliebtesten sind:

  1. gtkmm
  2. Qt
  3. wxWidgets
  4. Lieber ImuGui

Beispiel einer C++-GUI-Anwendung

Wir werden die folgenden Tools für die folgenden Programme verwenden:

  1. Qt-Bibliothek : Die GUI-Bibliothek für unser Programm.
  2. Qt-Designer: Ein interaktiver GUI-Vorlagendesigner für Qt.
  3. Qt-Ersteller: IDE für Qt-GUI-Anwendungen

Nun schauen wir uns reale Fälle für die GUI-Programmierung mit C++ und Qt an. Wir werden eine einfache Hello World-Anwendung mit einer Schaltfläche entwickeln und wenn auf die Schaltfläche geklickt wird, erscheint ein Dialogfeld mit darauf geschriebenem Hello World-Text. Wir werden es mit diesen Schritten implementieren:

Schritt 1: Erstellen eines Qt-Projekts

Wir öffnen den Qt Creator und erstellen ein neues Projekt vom Typ Qt Widget Application. Geben Sie den Namen ein, wählen Sie den Ort aus und schon kann es losgehen. Der Qt-Ersteller erstellt das Projekt mit allen erforderlichen Dateien.

Erstellungsprojekt

Schritt 2: Entwerfen des Fensters

Anschließend öffnen wir die Datei mainWindow.ui . Diese Datei enthält die Benutzeroberfläche der Anwendung. Wir werden mit dem gerade geöffneten Designer eine Textbeschriftung hinzufügen.

Jetzt enthalten unsere Dateien den folgenden Code:

mainWindow.h

C++

kmp-Algorithmus




#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>

>

>

main.cpp

C++




#include 'mainwindow.h'> > #include> > int> main(>int> argc,>char> *argv[])> {> >QApplication a(argc, argv);> >MainWindow w;> >w.show();> >return> a.exec();> }>

>

>

Boolescher Wert zum Stringen von Java

mainWindow.cpp

C++

Java-Wert der Zeichenfolge




#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


Konvertieren Sie ein Java-Objekt in JSON



xml version='1.0' encoding='UTF-8'?> MainWindowclass> 0x>0y>800Breite>600height> rect> property> MainWindowsstring> Eigenschaft> 260x>140 Jahre>81Breite>71height> rect> property> Hallo Weltstring> Eigenschaft> Widget> Widget> 0x>0y>800Breite>22height> rect> Eigenschaft> Widget>Widget> ui>>

>

>

Beachten Sie, dass mainWindow.ui in XML geschrieben ist. Dies liegt daran, dass Qt seine UI-Dateien in XML schreibt.

Schritt 4: Erstellen und ausführen

Wir können das Qt-Projekt im Qt Creator mit einem einzigen Klick erstellen und ausführen.

Ausgabe

Hallo Welt

Vorteile von GUI-Anwendungen

GUI-Anwendungen bieten mehrere Vorteile und tragen zu einer besseren Benutzererfahrung und einer optimierten Entwicklung bei:

  • Benutzerfreundliches Bedienfeld: Die Verwendung grafischer Benutzeroberflächen (GUIs) bietet einen einfachen und benutzerfreundlichen Ansatz für Softwareanwendungen im Vergleich zu anderen Ansätzen, die mehr Zeit in Anspruch nehmen würden.
  • Verbesserte Interaktivität: Es umfasst interaktive Funktionen wie Schaltflächen, Dropdown-Menüs, Kontrollkästchen und Schieberegler, mit denen Benutzer ihre Erfahrungen steuern können.
  • Plattformübergreifende Kompatibilität: Sprachen wie Qt ermöglichen die Erstellung von GUI-Anwendungen für Windows, macOS und Linux mit C++.
  • Rapid-Prototyping: Das Vorhandensein zahlreicher GUI-Builder und Designtools in GUI-Frameworks fördert das schnelle Prototyping von Schnittstellen und beschleunigt so den gesamten Entwicklungsprozess.