W świecie robotyki i elektroniki, gdzie precyzyjne sterowanie urządzeniami, wizualizacja danych z sensorów czy interaktywne panele operatorskie są codziennością, umiejętność tworzenia aplikacji okienkowych w C++ z biblioteką Qt staje się nieoceniona. Qt Widgets umożliwia budowanie stabilnych, multiplatformowych interfejsów graficznych (GUI), idealnych do desktopowych narzędzi sterujących robotami, symulatorów elektroniki czy programów do analizy danych z Arduino lub Raspberry Pi.
Ten rozbudowany artykuł poprowadzi cię krok po kroku przez stworzenie pierwszej aplikacji okienkowej w Qt C++. Skupimy się na module Qt Widgets, który jest prosty, dojrzały i zoptymalizowany pod aplikacje desktopowe – perfekcyjny dla inżynierów robotyki, gdzie priorytetem jest funkcjonalność nad efektownym designem.
Czym jest Qt i dlaczego warto go używać w robotyce?
Qt to potężny framework C++ do tworzenia multiplatformowych aplikacji. Poniżej kluczowe moduły, które najczęściej przydają się w projektach inżynierskich:
- Qt Core – fundament z klasami bazowymi, pętlą zdarzeń, kontenerami i systemem właściwości;
- Qt GUI – obsługa grafiki 2D/3D, OpenGL i zasobów multimedialnych w interfejsie;
- Qt Network – komunikacja sieciowa (TCP/UDP, HTTP, WebSocket) dla telemetrii i sterowania;
- Qt Multimedia – audio/wideo, strumieniowanie i przetwarzanie sygnałów z kamer.
W kontekście robotyki Qt wyróżnia się łatwą integracją z bibliotekami takimi jak ROS (Robot Operating System) oraz wsparciem dla Qt Quick przy dynamicznych wizualizacjach danych z kamer i sensorów.
Moduł Qt Widgets dostarcza gotowe klasy i elementy UI do klasycznych aplikacji okienkowych na desktopach – przyciski, menu, suwaki czy wykresy. To idealne rozwiązanie dla narzędzi sterujących robotami magazynowymi, paneli diagnostycznych elektroniki czy symulatorów obwodów, gdzie stabilność i wydajność C++ przeważają nad nowoczesnym „mobilnym” wyglądem. W przeciwieństwie do Qt Quick (QML dla UI mobilnych i urządzeń wbudowanych), Qt Widgets są prostsze w nauce dla programistów C++.
Aby szybko porównać podejścia do UI w Qt, zwróć uwagę na poniższe różnice:
| Aspekt | Qt Widgets | Qt Quick (QML) |
|---|---|---|
| Model UI | klasyczne widżety, natywne komponenty desktopowe | deklaratywny język QML, płynne animacje |
| Krzywa nauki | łatwiejsza dla programistów C++ | wymaga nauki QML/JavaScript |
| Zastosowanie | narzędzia desktopowe, panele sterowania, debug | interfejsy wbudowane, dotykowe, nowoczesne UI |
| Priorytet | stabilność, funkcjonalność, szybkość wdrożenia | animacje, responsywność, wygląd |
Dlaczego w robotyce? Wyobraź sobie aplikację monitorującą temperaturę z czujnika DS18B20 podłączonego do mikrokontrolera – Qt pozwoli szybko zbudować czytelne GUI z wykresami, przyciskami sterującymi silnikami i alarmami w czasie rzeczywistym.
Instalacja Qt i środowiska Qt Creator
Aby zacząć, zainstaluj Qt z oficjalnej strony qt.io – pobierz otwartoźródłową wersję (LGPL). Wybierz instalator dla swojego systemu (Windows, Linux, macOS). Qt Creator, zintegrowane IDE, zawiera wszystko: edytor kodu, debugger, Designer (WYSIWYG do UI) i narzędzia (MOC – Meta-Object Compiler, UIC – User Interface Compiler).
- Uruchom instalator i zaznacz komponenty: Qt 6.x (obsługa nowoczesnych standardów, np. C++23), MinGW (kompilator dla Windows) lub Clang/GCC dla Linux.
- Zainstaluj Qt Creator – kreator projektów automatycznie skonfiguruje profile budowania.
- Uruchom Qt Creator i skonfiguruj kit (kompilator + wersja Qt) w Tools > Options > Kits.
Test: stwórz pusty projekt C++ i skompiluj „Hello, World!” – jeśli budowa zakończy się sukcesem, środowisko jest poprawnie skonfigurowane. W robotyce Qt Creator integruje się z CMake, co ułatwia projekty z bibliotekami, takimi jak Boost czy OpenCV.
Mechanizmy Qt – QObject, sygnały i sloty
Podstawą Qt jest klasa QObject – rodzic wielu obiektów, obsługujący MOC (Meta-Object Compiler), który generuje kod dla introspekcji i dynamicznego wywoływania metod. Kluczowy mechanizm to sygnały i sloty – asynchroniczna komunikacja zdarzeń, idealna do robotyki (np. sygnał „dane z sensora” → slot „odśwież wykres”).
Przykładowe podłączenie zdarzenia do metody wygląda tak:
connect(button, &QPushButton::clicked, this, &MainWindow::onButtonClicked);
Tworzenie pierwszej aplikacji – krok po kroku
Stwórzmy aplikację z menu (zamknij/minimalizuj) i przyciskiem pokazującym komunikat – podstawę panelu sterowania robotem.
Krok 1 – nowy projekt w Qt Creator
Wykonaj poniższe czynności w kreatorze projektu:
- utwórz projekt – File > New File or Project > Applications > Qt Widgets Application;
- nazwij projekt –
RoboticsControlApp, a klasę główną ustaw jakoMainWindow(QMainWindow – baza z menu i paskiem narzędzi); - wskaz kit – wybierz właściwą wersję Qt i kompilator, zatwierdź tworzenie projektu.
Krok 2 – projektowanie UI w Qt Designer
Otwórz plik interfejsu i przygotuj podstawowe elementy sterujące:
- otwórz Designer – podwójnie kliknij
MainWindow.ui; - dodaj przycisk – z palety przeciągnij Push Button na centralny widget (QWidget);
- skonfiguruj właściwości – ustaw tekst przycisku na „Start robota”, a objectName na
startButton; - dodaj pasek menu – wstaw Menu Bar, następnie Add Separator > Type Here > App;
- utwórz akcje – w menu App dodaj: Zamknij (Ctrl+Q) i Minimalizuj (Ctrl+M);
- zapisz projekt – UIC wygeneruje
ui_MainWindow.hz definicją UI (XML).
Krok 3 – kod C++ w MainWindow.h
Rozszerz klasę o sloty i prywatne wskaźniki UI, dodając poniższy nagłówek:
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QPushButton>
#include <QMenuBar>
#include <QAction>
#include <QIcon>
#include <QMessageBox>
QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE
class MainWindow : public QMainWindow {
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private slots:
void on_startButton_clicked();
void on_actionZamknij_triggered();
void on_actionMinimalizuj_triggered();
private:
Ui::MainWindow *ui;
void createMenu();
};
#endif // MAINWINDOW_H
Krok 4 – implementacja w MainWindow.cpp
W konstruktorze zainicjuj UI i menu, a następnie dodaj implementacje slotów:
#include "mainwindow.h"
#include "ui_mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent), ui(new Ui::MainWindow)
{
ui->setupUi(this);
createMenu();
setWindowTitle("Panel sterowania robotem");
}
MainWindow::~MainWindow()
{
delete ui;
}
void MainWindow::createMenu()
{
QAction *actionZamknij = new QAction(QIcon(":/icons/close.png"), "&Zamknij", this);
actionZamknij->setShortcut(QKeySequence("Ctrl+Q"));
connect(actionZamknij, &QAction::triggered, this, &MainWindow::on_actionZamknij_triggered);
QAction *actionMinimalizuj = new QAction(QIcon(":/icons/minimize.png"), "&Minimalizuj", this);
actionMinimalizuj->setShortcut(QKeySequence("Ctrl+M"));
connect(actionMinimalizuj, &QAction::triggered, this, &MainWindow::on_actionMinimalizuj_triggered);
QMenu *menuApp = menuBar()->addMenu("&App");
menuApp->addAction(actionMinimalizuj);
menuApp->addAction(actionZamknij);
}
void MainWindow::on_startButton_clicked()
{
QMessageBox::information(this, "Robot", "Silniki uruchomione!");
}
void MainWindow::on_actionZamknij_triggered()
{
close();
}
void MainWindow::on_actionMinimalizuj_triggered()
{
showMinimized();
}
Ikony: dodaj pliki PNG do zasobów (.qrc) lub użyj ścieżek systemowych.
Krok 5 – main.cpp i kompilacja
Użyj standardowego punktu wejścia aplikacji Qt:
#include "mainwindow.h"
#include <QApplication>
int main(int argc, char *argv[])
{
QApplication app(argc, argv);
MainWindow window;
window.show();
return app.exec();
}
Build (Ctrl+B) > Run (Ctrl+R). Aplikacja działa – kliknij przycisk i pozycje menu, a sygnały i sloty zareagują natychmiast.
Rozszerzenia dla robotyki i elektroniki
Gdy podstawy działają, łatwo dobudujesz funkcje przydatne w realnych projektach:
- Integracja z hardwarem – dodaj Qt Serial Port do komunikacji z Arduino (odczyt sensorów jak IMU czy enkodery silników);
- Wykresy danych – użyj Qt Charts do wizualizacji telemetrii z robotów;
- Wielowątkowość – QThread dla zadań w tle (np. sterowanie PID bez blokowania UI);
- Multiplatformowość – jeden kod na PC w warsztacie i Raspberry Pi w pojeździe autonomicznym.
Kod źródłowy przykładu znajdziesz w repozytoriach, np. na binarnie.pl. W kolejnych krokach rozważ użycie Qt Quick dla interfejsów embedded i zaawansowanych wizualizacji.