Qt Samouczek
Rozpoczęcie pracy z Qt

Uwagi

Wersje

Instalacja i konfiguracja w systemie Windows i Linux

Pobierz wersję Qt dla Linux Open Source

Przejdź do https://www.qt.io/download-open-source/ i kliknij Pobierz teraz, upewnij się, że pobierasz instalator Qt dla systemu Linux.

Plik o nazwie qt-unified-linux-x-online.run zostanie pobrany, a następnie dodaj uprawnienia exec

chmod +x qt-unified-linux-x-online.run

Pamiętaj, aby zmienić „x” dla faktycznej wersji instalatora. Następnie uruchom instalator

./qt-unified-linux-x-online.run

Pobierz Qt dla Windows Open Source w wersji

Idź do https://www.qt.io/download-open-source/ . Poniższy zrzut ekranu pokazuje stronę pobierania w systemie Windows:

To, co powinieneś teraz zrobić, zależy od tego, którego IDE będziesz używać. Jeśli zamierzasz użyć Qt Creatora, który jest zawarty w programie instalacyjnym, po prostu kliknij Pobierz teraz i uruchom plik wykonywalny.

Jeśli zamierzasz używać Qt w Visual Studio, zwykle powinien również działać przycisk Pobierz teraz. Upewnij się, że pobrany plik nazywa się qt-opensource-windows-x86-msvc2015_64-xxxexe lub qt-opensource-windows-x86-msvc2015_32-xxxexe (gdzie xxx to wersja Qt, na przykład 5.7.0). Jeśli tak nie jest, kliknij opcję Wyświetl wszystkie pobrane i wybierz jedną z czterech pierwszych opcji w obszarze Windows Host.

Jeśli zamierzasz używać Qt w Code :: Blocks, kliknij Wyświetl wszystkie pobrane i wybierz Qt xxx dla Windows 32-bit (MinGW xxx, 1,2 GB) w Windows Host.

Po pobraniu odpowiedniego pliku instalatora uruchom plik wykonywalny i postępuj zgodnie z instrukcjami poniżej. Pamiętaj, że musisz być administratorem, aby zainstalować Qt. Jeśli nie jesteś administratorem, można znaleźć kilka alternatywnych rozwiązań tutaj .

Zainstaluj Qt w dowolnym systemie operacyjnym

Po pobraniu Qt i otwarciu programu instalacyjnego procedura instalacji jest taka sama dla wszystkich systemów operacyjnych, chociaż zrzuty ekranu mogą wyglądać nieco inaczej. Zrzuty ekranu dostarczone tutaj pochodzą z systemu Linux.

Zaloguj się przy użyciu istniejącego konta Qt lub utwórz nowe:

Wybierz ścieżkę, aby zainstalować biblioteki i narzędzia Qt

Wybierz wersję biblioteki i żądane funkcje

Po pobraniu i zakończeniu instalacji przejdź do katalogu instalacyjnego Qt i uruchom Qt Creator lub uruchom go bezpośrednio z wiersza poleceń.

Witaj świecie

W tym przykładzie po prostu tworzymy i pokazujemy przycisk w ramce okna na pulpicie. Przycisk będzie miał etykietę Hello world!

Jest to najprostszy możliwy program Qt.

Po pierwsze potrzebujemy pliku projektu:

helloworld.pro

QT       += core gui

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = helloworld
TEMPLATE = app

SOURCES += main.cpp

• QT służy do wskazania, jakie biblioteki (moduły Qt) są używane w tym projekcie. Ponieważ nasza pierwsza aplikacja to mały GUI, potrzebujemy QtCore i QtGui. Ponieważ Qt5 oddziela QtWidgets od QtGui, musimy dodać linię greaterThan , aby skompilować ją z Qt5.
• TARGET to nazwa aplikacji lub biblioteki.
• SZABLON opisuje typ do zbudowania. Może to być aplikacja (aplikacja), biblioteka (lib) lub po prostu podkatalogi (podkatalogi).
• ŹRÓDŁA to lista plików kodu źródłowego, które będą używane podczas budowania projektu.

Potrzebujemy również pliku main.cpp zawierającego aplikację Qt:

main.cpp

#include <QApplication>
#include <QPushButton>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);

    QPushButton button ("Hello world!");
    button.show();

    return a.exec(); // .exec starts QApplication and related GUI, this line starts 'event loop'    
}

• Obiekt QApplication. Ten obiekt zarządza zasobami aplikacji i jest niezbędny do uruchomienia dowolnego programu Qt, który ma GUI. Wymaga argv i args, ponieważ Qt akceptuje kilka argumentów wiersza poleceń. Podczas wywoływania a.exec() uruchamiana jest pętla zdarzeń Qt.
• Obiekt QPushButton. Przycisk z etykietą Hello world! . Następny wiersz, button.show() , pokazuje przycisk na ekranie we własnej ramce okna.

Na koniec, aby uruchomić aplikację, otwórz wiersz polecenia i przejdź do katalogu, w którym znajduje się plik .cpp programu. Wpisz następujące polecenia powłoki, aby zbudować program.

qmake -project
qmake
make

Podstawowa aplikacja z QtCreator i QtDesigner

QtCreator jest obecnie najlepszym narzędziem do tworzenia aplikacji Qt. W tym przykładzie zobaczymy, jak utworzyć prostą aplikację Qt, która zarządza przyciskiem i pisze tekst.

Aby utworzyć nową aplikację, kliknij Plik-> Nowy plik lub Projekt:

Następnie wybierz Projekty-> Aplikacja-> Aplikacja Qt Widgets

Następnie możesz wybrać nazwę i ścieżkę swojego projektu:

Następnie możesz wybrać zestawy, których będziesz używać. Jeśli nie masz żadnego zestawu, QtCreator utworzy zestaw z twoją wersją Qt i głównym kompilatorem twojego komputera. Jeśli nie masz żadnego kompilatora, możesz go zainstalować. W systemie Windows: zainstaluj program Visual Studio. W systemie Linux / Mac: zainstaluj g ++ lub clang ++.

Następnie możesz wybrać nazwę głównej klasy okna, odziedziczoną klasę, nazwę pliku odpowiadającą głównej klasie okna. Jeśli uczysz się lub testujesz Qt, tak naprawdę nie musisz ich zmieniać.

Ostatnim krokiem może być wybranie podprojektu tego projektu i dodanie kontroli wersji, takiej jak git i svn. Ponownie, jeśli dotyczy to tylko testów, nie musisz ich zmieniać.

Następnie kliknij przycisk Zakończ. Teraz powinieneś tu być:

To jest podstawa twojej aplikacji. jeśli uruchomisz go teraz, klikając Build-> Run lub ctrl + R (domyślnie) zobaczysz puste okno.

Teraz dodamy tekst i przycisk. w tym celu użyjemy Qt Designer. Kliknij dwukrotnie mainwindow.ui Więc powinieneś zobaczyć: (jeśli nie, a zobaczysz plik xml, kliknij przycisk Projekt po lewej)

Oto Qt Designer! Wydaje się dość skomplikowane. Ale kiedy już się przyzwyczaisz, to naprawdę świetnie. Dodamy trochę tekstu i przycisk. Po lewej stronie znajduje się lista przedmiotów. Możesz kliknąć jeden i przeciągnąć i upuścić obiekty. Kliknij przycisk i upuść go w oknie. Następnie wyszukaj etykietę i zrób to samo (w lewym górnym rogu masz filtr, w którym możesz napisać szukany obiekt).

Powinieneś mieć teraz coś takiego:

Dwukrotne kliknięcie obiektu umożliwia zmianę tekstu na nim. Lub możesz zobaczyć w prawym dolnym rogu właściwości obiektu, którym jesteś teraz i znaleźć właściwość text. Tutaj możesz również zmienić nazwę.

Teraz, jeśli zapiszesz i uruchomisz (lepiej kliknij przycisk edycji, a następnie zapisz ponownie, aby upewnić się, że zmiany zostały zapisane), otrzymasz:

Co? Dlaczego moja etykieta i przycisk są takie po uruchomieniu? To dlatego, że nie ma układu w naszym obiekcie centralnym. Nawiasem mówiąc, jeśli zmienisz rozmiar głównego okna, możesz zobaczyć, że obiekt zachowuje swoje miejsce. Aby to naprawić, dodamy układ. Powiedzmy, że układ pionowy. Przeciągnij i upuść układ pionowy z listy obiektów po lewej stronie. Teraz powinieneś zobaczyć:

Układ pływający.

Teraz kliknij prawym przyciskiem myszy główne okno, gdziekolwiek, z wyjątkiem etykiety i przycisku. c \ Kliknij polecenie Układ -> Układ w pionie. Teraz powinieneś zobaczyć, że twoje obiekty są ustawione pionowo w oknie. Teraz przenieś (ponownie przeciągnij i upuść) etykietę i przycisk w układzie. teraz powinieneś otrzymać:

U twojego projektanta. A jeśli uruchomisz swoją aplikację:

Tutaj możesz zobaczyć swoją aplikację z etykietą i przyciskiem. A jeśli zmienisz rozmiar okna, zmienia się również rozmiar etykiety i przycisku.

Ale nasz przycisk wciąż nic nie robi. Możemy to zmienić na 2 różne sposoby. Pierwszym z nich jest połączenie przycisku utworzoną przez nas metodą. Możemy to zrobić z nazwą metody connect. Wróćmy więc do naszego kodu i przejdźmy do mainwindow.cpp teraz dodaj:

connect(ui->pushButton, SIGNAL(clicked(bool)), this, SLOT(whenButtonIsClicked()));

W konstruktorze twojego MainWindow PO ui->setupUI(this); które inicjują interfejs użytkownika.

Następnie możemy utworzyć MainWindow :: whenButtonIsClicked () w naszej klasie .cpp, która mogłaby zmienić tekst etykiety w ten sposób:

void MainWindow::whenButtonIsClicked()
{
    ui->label->setText("the button has been clicked !");
}

A w naszym mainwindow.h musimy dodać:

public slots:
    void whenButtonIsClicked();

Publiczne sloty oznaczają, że tę metodę można wywołać po odebraniu sygnału. połącz link sygnał po kliknięciu przycisku i metodę wywołania.

Jeśli teraz uruchomimy naszą aplikację i klikniemy przycisk, otrzymamy:

Co oznacza, że nasz connect działa. Ale z Qt Designer mamy jeszcze prostszy sposób na zrobienie tego. Jeśli chcesz zrobić to w inny sposób, usuń połączenie, aby odłączyć przycisk (ponieważ podłączymy go inaczej), wróć do mainwindow.ui i kliknij prawym przyciskiem myszy przycisk. Kliknij Idź do gniazda ..., wybierz kliknięty () i naciśnij OK.

Następnie powinieneś przejść do tej funkcji:

void MainWindow::on_pushButton_clicked()
{
}

Jest to funkcja, która zostanie wywołana po kliknięciu przycisku. Możesz więc dodać

ui->label->setText("it's even easier !");

W tym. Przejdź do mainwindow.h, aby zapisać zmianę (kiedy robisz przejście do slotu, tworzy metodę powiązaną z żądanym sygnałem. Definiuje funkcję w .h, ale nie zapisuj jej. Więc powinieneś iść do pliku i zapisz go).

A teraz, kiedy uruchomisz aplikację i naciśniesz przycisk, zobaczysz nową wiadomość (jeśli nadal widzisz starą, oznacza to, że nie usunąłeś połączenia).

Możemy również dodać int, double, itp. Do naszej etykiety dzięki QVariant która jest niesamowitą klasą, która może przekształcić wiele rzeczy w wiele innych rzeczy. Więc w lewo dodaj int, który zwiększa się po naciśnięciu przycisku.

Więc .h:

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

public slots:
    void whenButtonIsClicked();

private slots:
    void on_pushButton_clicked();

private:
    Ui::MainWindow  *ui;
    double          _smallCounter;
};

#endif // MAINWINDOW_H

.Cpp:

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
//    connect(ui->pushButton, SIGNAL(clicked(bool)), this, SLOT(whenButtonIsClicked()));
    _smallCounter = 0.0f;
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::whenButtonIsClicked()
{
    ui->label->setText("the button has been clicked !");
}

void MainWindow::on_pushButton_clicked()
{
    _smallCounter += 0.5f;
    ui->label->setText("it's even easier ! " + QVariant(_smallCounter).toString());
}

A teraz możemy zapisać i uruchomić ponownie. Za każdym razem, gdy klikniesz przycisk, pokazuje on „to jest jeszcze łatwiejsze!” Z wartością _smallCounter. Więc powinieneś mieć coś takiego:

Ten samouczek jest gotowy. Jeśli chcesz dowiedzieć się więcej o Qt, zobacz inne przykłady i dokumentację Qt w Dokumentacji StackOverflow lub Dokumentacji Qt