Auf dieser Seite

Qt Widgets -Designer kennenlernen

Screenshot, der die Benutzeroberfläche des Qt Widgets Designer-Editors zeigt

Designer starten

Sobald Sie Qt installiert haben, können Sie den „ Qt Widgets “-Designer wie jede andere Anwendung auf dem Entwicklungshost starten. Sie können den „ Qt Widgets “-Designer auch direkt über „ Qt Creator “ starten. „ Qt Creator “ öffnet automatisch alle .ui-Dateien im integrierten „ Qt Widgets “-Designer im Design-Modus.

Im Allgemeinen verfügt der integrierte „ Qt Widgets “-Designer über dieselben Funktionen wie der eigenständige „ Qt Widgets “-Designer. Weitere Informationen zu den Unterschieden finden Sie im Handbuch zuQt Creator .

Wenn Sie umfangreiche Formulare haben, die nicht in den Designmodus des „ Qt Creator “ passen, können Sie diese im eigenständigen „ Qt Widgets “-Designer öffnen.

Die Benutzeroberfläche

Bei Verwendung als eigenständige Anwendung kann die Benutzeroberfläche des „ Qt Widgets -Designers“ so konfiguriert werden, dass entweder eine Benutzeroberfläche mit mehreren Fenstern (Standardmodus) oder ein angedockter Fenstermodus zur Verfügung steht. Bei Verwendung innerhalb einer integrierten Entwicklungsumgebung (IDE) steht nur die Benutzeroberfläche mit mehreren Fenstern zur Verfügung. Sie können im Dialogfeld „Einstellungen“ im Menü „Bearbeiten“ zwischen den Modi wechseln.

Im Mehrfenster-Modus können Sie die einzelnen Werkzeugfenster entsprechend Ihrem Arbeitsstil anordnen. Das Hauptfenster besteht aus einer Menüleiste, einer Symbolleiste und einer Widget-Box, die die Widgets enthält, mit denen Sie Ihre Benutzeroberfläche erstellen können.

Screenshot des <span translate=Qt Widgets Designers, der alle Komponenten zeigt, die dem Fenster hinzugefügt werden können" src="images/designer-main-window.png" title="Screenshot des Qt Widgets Designers, der alle Komponenten zeigt, die dem Fenster hinzugefügt werden können"/>Qt Widgets Hauptfenster des Designers

Die Menüleiste bietet alle Standardfunktionen zur Verwaltung von Formularen, zur Nutzung der Zwischenablage und zum Aufrufen der anwendungsspezifischen Hilfe. Über die Menüleiste können Sie außerdem auf den aktuellen Bearbeitungsmodus, die Werkzeugfenster und die verwendeten Formulare zugreifen.

Die Symbolleiste zeigt häufig verwendete Aktionen an, die beim Bearbeiten eines Formulars zum Einsatz kommen. Diese sind auch über das Hauptmenü verfügbar.

Die Widget-Box enthält gängige Widgets und Layouts, die zum Entwerfen von Komponenten verwendet werden. Diese sind in Kategorien gruppiert, die ihre Verwendungszwecke oder Funktionen widerspiegeln.

Die meisten Funktionen des „ Qt Widgets -Designers“ sind über die Menüleiste, die Symbolleiste oder die Widget-Box zugänglich. Einige Funktionen sind zudem über Kontextmenüs verfügbar, die über den Formularfenstern geöffnet werden können. Auf den meisten Plattformen wird die rechte Maustaste zum Öffnen von Kontextmenüs verwendet.

Screenshot, der alle Widget-Komponenten für den <span translate=Qt Widgets Designer zeigt" src="images/designer-widget-box.png" title="Screenshot, der alle Widget-Komponenten für den Qt Widgets Designer zeigt"/>Qt Widgets Die Widget-Box des Designers

Die Widget-Box bietet eine Auswahl an Standard-Qt-Widgets, Layouts und anderen Objekten, die zum Erstellen von Benutzeroberflächen in Formularen verwendet werden können. Jede der Kategorien in der Widget-Box enthält Widgets mit ähnlichem Verwendungszweck oder verwandten Funktionen.

Sie können alle verfügbaren Objekte einer Kategorie anzeigen, indem Sie auf den Griff neben der Kategoriebezeichnung klicken. Im Widget-Bearbeitungsmodus können Sie Objekte zu einem Formular hinzufügen, indem Sie die entsprechenden Elemente aus der Widget-Box auf das Formular ziehen und an den gewünschten Stellen ablegen.

Qt Widgets Der Designer bietet eine Notizblock-Funktion, mit der Sie häufig verwendete Objekte in einer separaten Kategorie sammeln können. Die Notizblock-Kategorie kann mit jedem Widget gefüllt werden, das derzeit in einem Formular angezeigt wird, indem Sie es aus dem Formular ziehen und in die Widget-Box ablegen. Diese Widgets können wie alle anderen Widgets verwendet werden, können aber auch untergeordnete Widgets enthalten. Öffnen Sie ein Kontextmenü über einem Widget, um dessen Namen zu ändern oder es aus dem Notizblock zu entfernen.

Das Konzept der Layouts in Qt

Ein Layout dient dazu, die Elemente, aus denen sich eine Benutzeroberfläche zusammensetzt, anzuordnen und zu verwalten. Qt stellt eine Reihe von Klassen zur automatischen Verwaltung von Layouts bereit – „ QHBoxLayout “, „ QVBoxLayout “, „ QGridLayout “ und „ QFormLayout “. Diese Klassen lösen das Problem der automatischen Anordnung von Widgets und sorgen für eine Benutzeroberfläche, die sich vorhersehbar verhält. Glücklicherweise sind Kenntnisse über die Layout-Klassen nicht erforderlich, um Widgets mit dem „ Qt Widgets -Designer“ anzuordnen. Wählen Sie stattdessen eine der Optionen wie „Horizontal anordnen“, „In einem Raster anordnen“ usw. aus dem Kontextmenü aus.

Jedes Qt Widget verfügt über eine empfohlene Größe, die als „ sizeHint “ () bezeichnet wird. Der Layout-Manager versucht, die Größe eines Widgets so anzupassen, dass sie dem „Size Hint“ entspricht. In manchen Fällen ist eine abweichende Größe nicht erforderlich. Beispielsweise ist die Höhe eines „ QLineEdit “ immer ein fester Wert, der von der Schriftgröße und dem Schriftstil abhängt. In anderen Fällen kann es erforderlich sein, die Größe anzupassen, z. B. die Breite eines „ QLineEdit “ oder die Breite und Höhe von Widgets in der Elementansicht. Hier kommen die Größenbeschränkungen für Widgets ins Spiel – „ minimumSize “ und „ maximumSize “. Diese Eigenschaften können Sie im Eigenschafteneditor festlegen. Um beispielsweise die Standardgröße „ sizeHint “ () zu überschreiben, setzen Sie einfach „ minimumSize “ und „ maximumSize “ auf denselben Wert. Alternativ können Sie die aktuelle Größe als Wert für die Größenbeschränkung verwenden, indem Sie eine der Optionen unter „Größenbeschränkung“ im Kontextmenü des Widgets auswählen. Das Layout stellt dann sicher, dass diese Beschränkungen eingehalten werden. Um die Größe Ihrer Widgets per Code zu steuern, können Sie die Methode ` sizeHint()` in Ihrem Code neu implementieren.

Der folgende Screenshot zeigt die Aufschlüsselung einer einfachen Benutzeroberfläche, die mithilfe eines Rasters gestaltet wurde. Die Koordinaten auf dem Screenshot geben die Position der einzelnen Widgets innerhalb des Rasters an.

Screenshot einer Adressbuch-Anwendung, in dem alle Widget-Komponenten und ihre Position hervorgehoben sind

Hinweis: Innerhalb des Rasters sind die „ QPushButton “-Objekte tatsächlich verschachtelt. Die Schaltflächen auf der rechten Seite werden zunächst in einem „ QVBoxLayout “ platziert; die Schaltflächen unten werden zunächst in einem „ QHBoxLayout “ platziert. Schließlich werden sie an den Koordinaten (1,2) und (2,1) des „ QGridLayout “ positioniert.

Um sich das vorzustellen: Stellen Sie sich das Layout als eine Box vor, die so weit wie möglich geschrumpft wird, um Ihre Widgets in einer übersichtlichen Anordnung unterzubringen und gleichzeitig den verfügbaren Platz optimal zu nutzen.

Die Layouts von Qt helfen Ihnen, wenn Sie:

  1. die Benutzeroberfläche an unterschiedliche Fenstergrößen anpassen.
  2. die Größe von Elementen innerhalb der Benutzeroberfläche an unterschiedliche Lokalisierungen anpassen.
  3. Elemente so anordnen, dass sie den Layout-Richtlinien für verschiedene Plattformen entsprechen.

Sie müssen sich also keine Gedanken mehr darüber machen, Widgets für verschiedene Plattformen, Einstellungen und Sprachen neu anzuordnen.

Das folgende Beispiel zeigt, wie sich unterschiedliche Lokalisierungen auf die Benutzeroberfläche auswirken können. Wenn eine Lokalisierung aufgrund längerer Textzeichenfolgen mehr Platz benötigt, passt das Qt-Layout seine Größe automatisch an, um dies zu berücksichtigen, und stellt gleichzeitig sicher, dass die Benutzeroberfläche ansprechend aussieht und weiterhin den Plattformrichtlinien entspricht.

Ein Dialogfeld auf EnglischEin Dialogfeld auf Französisch

Screenshot mit einem Beispiel für ein Adressbuch auf Englisch

Screenshot mit einem Beispiel für ein Adressbuch auf Französisch

Der Prozess der Anordnung von Widgets besteht darin, die Layout-Hierarchie zu erstellen und dabei so wenige Größenbeschränkungen für die Widgets wie möglich festzulegen.

Eine technischere Betrachtung der Layout-Klassen von Qt finden Sie in der Dokumentation zum Layout-Management.

© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.