I C++ är programmering med grafiskt användargränssnitt (GUI) viktigt i modern applikationsutveckling där användarna har snygg grafik att arbeta med. Även om C++ ofta är kopplat till systemprogrammering och spelskrivning, kan det vara ett utmärkt alternativ till GUI-skrivning. I den här artikeln kommer vi att diskutera GUI-programmering i C++, några populära GUI-bibliotek för C++ och hur man skapar en grundläggande GUI-applikation i C++.
Förutsättningar: Grunderna i C++, C++ OOPs, något GUI-bibliotek.
Vad är GUI (Graphical User Interface)?
Det grafiska användargränssnittet (GUI) är ett visuellt applikationsgränssnitt som tillhandahålls med hjälp av grafik som fönster, textrutor och knappar genom vilka användare kan kommunicera med programvaran. GUI erbjuder en interaktiv och lättanvänd plattform jämfört med Command Line Interface (CLI) eftersom användare kan använda musen eller andra inmatningsenheter som en pekskärm, etc. utan att bara lita på tangentbordet.
Huvudkoncept för GUI-programmering
Ett grafiskt användargränssnitt (GUI) involverar design av fönster, dialogrutor, knappar, etc som alla är interaktiva användargränssnittskomponenter. Sedan styr vi dessa widgets med hjälp av händelsehanterare som onClick, onHover, etc.
Huvudkoncepten för GUI-programmering är:
Widgets
Ett grafiskt användargränssnitt (GUI) består av widgets. Dessa inkluderar till exempel knappar, textrutor, etiketter etc. Egenskaper och beteenden för varje widget kan anpassas i enlighet med de specifika behoven för en applikation. Det finns i allmänhet följande widgets i ett GUI-bibliotek:
- Fönster: En fönsterram på toppnivå som är värd för andra widgets inuti sig själv.
- Knapp: En klickbar knapp som har en händelse kopplad till dess klick.
- Märka: Enkel skrivskyddad text
- Kryssruta : Box som ger alternativen att vara på eller av.
- Radio knapp: Box som ger alternativen att vara på eller av men vi kan bara välja en alternativknapp i en grupp.
- Dropdown/Combo Box : Öppnar en rullgardinsmeny när du klickar på den. Endast ett objekt kan visas i det oöppnade formuläret.
- Textruta: Redigerbart textområde.
- Listbox: Rutan med flera föremål och en rullningslist för att gå igenom dem alla.
- Reglage: En navigeringswidget som används för att flytta runt i programmet.
- Meny: Visas högst upp, menyn ger olika alternativ för applikationsanvändaren.
- Dialog ruta: En ruta som visas överst i ett fönster. Ibland för att visa aviseringen.
- Rutnät: Används för layouthantering av användargränssnittet.
Layouthantering
GUI-applikationerna måste optimeras för olika skärmar av olika storlekar, upplösningar etc som försöker behålla ett attraktivt men effektivt användargränssnitt med de olika widgetarna organiserade på skärmen.
Eventhantering
I GUI-programmering är händelser som knappklick eller knapptryck kritiska. Dessa händelser hanteras av appen för att den ska kunna följa användarens handlingar. Det finns olika händelser kopplade till olika widgets. Till exempel, för en klickbar knapp är de associerade händelserna:
- Klicka på Händelse
- Mouse Move Event
- Fokus I Event
- Fokusera ut händelse
Populära GUI-bibliotek för C++
C++ har många plattformsoberoende GUI-bibliotek som kan användas för att utveckla en GUI-applikation. Några av de populära är:
- gtkmm
- Qt
- wxWidgets
- Kära ImuGui
Exempel på C++ GUI-applikation
Vi kommer att använda följande verktyg för följande program:
- Qt bibliotek : GUI-biblioteket för vårt program.
- Qt Designer: En interaktiv GUI-malldesigner för Qt.
- Qt Creator: IDE för Qt GUI-applikationer
Nu kommer vi att titta på verkliga fall för GUI-programmering med C++ och Qt. Vi kommer att utveckla en grundläggande Hello World-applikation en knapp och när knappen klickas visas en dialogruta med Hello World-text skriven på den. Vi kommer att implementera det med dessa steg:
Steg 1: Skapa ett Qt-projekt
Vi kommer att öppna Qt Creator och skapa ett nytt projekt av typen Qt Widget Application. Ange namnet, välj platsen och du är klar. Qt-skaparen kommer att skapa projektet med alla nödvändiga filer.
Steg 2: Designa fönstret
Vi öppnar sedan filen mainWindow.ui . Den här filen innehåller applikationens användargränssnitt. Vi kommer att lägga till en textetikett med hjälp av designern som just öppnades.
Nu kommer våra filer att innehålla följande kod:
mainWindow.h
C++
sammanfoga java-strängen
#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();> }> |
>
>
mainWindow.cpp
C++
svm
#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'?> |
>
>
Observera att mainWindow.ui är skrivet i XML. Det beror på att Qt skriver sina UI-filer i XML.
Steg 4: Bygg och kör
Vi kan bygga och köra Qt-projektet i Qt Creator med ett enda klick.
Produktion
Fördelar med GUI-applikationer
GUI-applikationer erbjuder flera fördelar, vilket bidrar till en bättre användarupplevelse och strömlinjeformad utveckling:
- Användarvänligt gränssnitt: Användningen av grafiska användargränssnitt (GUI) ger en enkel och lättanvänd metod för mjukvaruapplikationer jämfört med andra tillvägagångssätt som skulle ta längre tid.
- Förbättrad interaktivitet: Den omfattar interaktiva funktioner som knappar, rullgardinsmenyer, kryssruta och skjutreglage som ger användarna makt över sina upplevelser.
- Cross-Platform-kompatibilitet: Språken som Qt möjliggör skapande av GUI-applikationer för Windows, macOS, Linux med C++.
- Snabb prototyping: Närvaron av många GUI-byggare och designverktyg i GUI-ramverk främjar snabb prototypframställning av gränssnitt, vilket gör hela utvecklingsprocessen snabbare.