Codieren einer einfachen grafischen Java-Benutzeroberfläche

Eine grafische Benutzeroberfläche (GUI), die mit dem erstellt wurde Java NetBeans-Plattform besteht aus mehreren Schichten von Behältern. Die erste Ebene ist das Fenster, in dem die Anwendung auf dem Bildschirm Ihres Computers verschoben wird. Dies wird als Container der obersten Ebene bezeichnet. Seine Aufgabe besteht darin, allen anderen Containern und grafischen Komponenten einen Arbeitsplatz zu bieten. In der Regel wird dieser Container der obersten Ebene für eine Desktop-Anwendung mithilfe von erstellt

Klasse.

Sie können Ihrem GUI-Design je nach Komplexität beliebig viele Ebenen hinzufügen. Sie können grafische Komponenten (z. B. Textfelder, Beschriftungen, Schaltflächen) direkt in das Feld einfügen

, oder Sie können sie in anderen Containern gruppieren.

Die Ebenen der GUI werden als Containment-Hierarchie bezeichnet und können als Stammbaum betrachtet werden. Wenn die

Wenn der Großvater oben sitzt, kann man sich den nächsten Behälter als den Vater und die Komponenten vorstellen, die er als Kinder enthält.

instagram viewer

In diesem Beispiel erstellen wir eine GUI mit a

mit zwei

und ein

. Der Erste

wird ein halten

und

. Der Zweite

wird ein halten

und ein

. Nur eine

(und damit die darin enthaltenen grafischen Komponenten) sind jeweils sichtbar. Die Schaltfläche wird verwendet, um die Sichtbarkeit der beiden zu ändern

Es gibt zwei Möglichkeiten, diese GUI mit NetBeans zu erstellen. Die erste besteht darin, den Java-Code, der die in diesem Artikel beschriebene GUI darstellt, manuell einzugeben. Die zweite Möglichkeit besteht darin, das NetBeans GUI Builder-Tool zum Erstellen von Swing-GUIs zu verwenden.

Informationen zur Verwendung von JavaFX anstelle von Swing zum Erstellen einer GUI finden Sie unter Was ist JavaFX??

Hinweis: Der vollständige Code für dieses Projekt ist bei Beispiel für einen Java-Code zum Erstellen einer einfachen GUI-Anwendung.

Einrichten des NetBeans-Projekts

Erstelle eine neue Java Anwendungsprojekt in NetBeans mit einer Hauptklasse Wir nennen das Projekt

Kontrollpunkt: Im Projektfenster von NetBeans sollte sich ein GuiApp1-Ordner der obersten Ebene befinden (wenn der Name nicht fett gedruckt ist, klicken Sie mit der rechten Maustaste auf den Ordner und wählen Sie

). Unter der

Ordner sollte ein Quellpaket-Ordner mit sein

genannt GuiApp1. Dieser Ordner enthält die Hauptklasse namens

.Java.

Bevor wir Java-Code hinzufügen, fügen Sie die folgenden Importe oben in das Feld ein

Klasse, zwischen dem

Linie und die

Diese Importe bedeuten, dass alle Klassen, die wir zum Erstellen dieser GUI-Anwendung benötigen, für uns verfügbar sind.

Fügen Sie innerhalb der Hauptmethode diese Codezeile hinzu:

Dies bedeutet, dass das erste, was zu tun ist, ein neues zu erstellen

Objekt. Es ist eine schöne Abkürzung zum Beispiel für Programme, da wir nur eine Klasse benötigen. Damit dies funktioniert, benötigen wir einen Konstruktor für die

Klasse, also fügen Sie eine neue Methode hinzu:

Bei dieser Methode wird der gesamte Java-Code eingefügt, der zum Erstellen der GUI erforderlich ist. Dies bedeutet, dass sich von nun an jede Zeile innerhalb der befindet

Methode.

Design Hinweis: Möglicherweise wurde Java-Code veröffentlicht, der die Klasse anzeigt (d. H.

) erweitert von a

. Diese Klasse wird dann als Hauptfenster der GUI für eine Anwendung verwendet. Für eine normale GUI-Anwendung ist dies wirklich nicht erforderlich. Das einzige Mal, wenn Sie die verlängern möchten

Klasse ist, wenn Sie einen spezifischeren Typ von erstellen müssen

(Schau dir das an

Weitere Informationen zum Erstellen einer Unterklasse).

Wie bereits erwähnt, ist die erste Schicht der GUI ist ein Anwendungsfenster aus a

. So erstellen Sie eine

Objekt, rufen Sie die

Konstrukteur:

Als Nächstes legen wir das Verhalten unseres GUI-Anwendungsfensters mithilfe der folgenden vier Schritte fest:

1. Stellen Sie sicher, dass die Anwendung geschlossen wird, wenn der Benutzer das Fenster schließt, damit es im Hintergrund nicht unbekannt weiter ausgeführt wird:

2. Legen Sie einen Titel für das Fenster fest, damit das Fenster keine leere Titelleiste hat. Fügen Sie diese Zeile hinzu:

3. Stellen Sie die Fenstergröße so ein, dass das Fenster so dimensioniert ist, dass es die grafischen Komponenten berücksichtigt, die Sie darin platzieren.

Design Hinweis: Eine alternative Option zum Festlegen der Fenstergröße ist das Aufrufen von

Methode der

Klasse. Diese Methode berechnet die Größe des Fensters basierend auf den darin enthaltenen grafischen Komponenten. Da diese Beispielanwendung ihre Fenstergröße nicht ändern muss, verwenden wir einfach die

Methode.

4. Zentrieren Sie das Fenster so, dass es in der Mitte des Computerbildschirms angezeigt wird, sodass es nicht in der oberen linken Ecke des Bildschirms angezeigt wird:

Hinzufügen der beiden JPanels

Die beiden Zeilen hier erstellen Werte für die

und

Objekte, die wir in Kürze mit zwei erstellen werden

Arrays. Dies erleichtert das Auffüllen einiger Beispieleinträge für diese Komponenten:

Erstellen Sie das erste JPanel-Objekt

Jetzt erstellen wir die erste

Objekt. Es wird a enthalten

und ein

. Alle drei werden über ihre Konstruktormethoden erstellt:

Anmerkungen zu den obigen drei Zeilen:

Das
```
JPanel
```
Variable wird deklariert Finale. Dies bedeutet, dass die Variable nur die enthalten kann
```
JPanel
```
das ist in dieser Zeile erstellt. Das Ergebnis ist, dass wir die Variable in einer inneren Klasse verwenden können. Es wird deutlich, warum wir später im Code wollen.
Das
```
JLabel
```
und
```
JComboBox
```
Lassen Sie sich Werte übergeben, um ihre grafischen Eigenschaften festzulegen. Das Etikett wird als "Früchte:" angezeigt und die Combobox enthält jetzt die Werte in der
```
FruchtOptionen
```
Array früher deklariert.
Das
```
hinzufügen()
```
Methode der
```
JPanel
```
platziert grafische Komponenten darin. EIN
```
JPanel
```
verwendet das FlowLayout als Standard Layout Manager. Dies ist für diese Anwendung in Ordnung, da das Etikett neben der Combobox angebracht werden soll. Solange wir das hinzufügen
```
JLabel
```
Erstens wird es gut aussehen:

Erstellen Sie das zweite JPanel-Objekt

Der Zweite

folgt dem gleichen Muster. Wir werden eine hinzufügen

und ein

und setzen Sie die Werte dieser Komponenten auf "Gemüse:" und die zweite

Array

. Der einzige andere Unterschied ist die Verwendung der

Methode, um die zu verstecken

. Vergiss nicht, dass es eine geben wird

Kontrolle der Sichtbarkeit der beiden

. Damit dies funktioniert, muss man am Anfang unsichtbar sein. Fügen Sie diese Zeilen hinzu, um die zweite einzurichten

Eine im obigen Code erwähnenswerte Zeile ist die Verwendung von

Methode der

. Das

Mit value zeigt die Liste die darin enthaltenen Elemente in zwei Spalten an. Dies wird als "Zeitungsstil" bezeichnet und ist eine gute Möglichkeit, eine Liste von Elementen anstelle einer traditionelleren vertikalen Spalte anzuzeigen.

Hinzufügen von Finishing Touches

Die letzte benötigte Komponente ist die

um die Sichtbarkeit der zu kontrollieren

s. Der in der übergebene Wert

Der Konstruktor legt die Bezeichnung der Schaltfläche fest:

Dies ist die einzige Komponente, für die ein Ereignis-Listener definiert ist. Ein "Ereignis" tritt auf, wenn ein Benutzer mit einer grafischen Komponente interagiert. Wenn ein Benutzer beispielsweise auf eine Schaltfläche klickt oder Text in ein Textfeld schreibt, tritt ein Ereignis auf.

Ein Ereignis-Listener teilt der Anwendung mit, was zu tun ist, wenn das Ereignis eintritt.

Verwendet die ActionListener-Klasse, um auf einen Schaltflächenklick des Benutzers zu "warten".

Erstellen Sie den Ereignis-Listener

Da diese Anwendung beim Klicken auf die Schaltfläche eine einfache Aufgabe ausführt, können wir eine anonyme innere Klasse verwenden, um den Ereignis-Listener zu definieren:

Dies mag wie beängstigender Code aussehen, aber Sie müssen ihn nur aufschlüsseln, um zu sehen, was passiert:

Zuerst nennen wir die
```
addActionListener
```
Methode der
```
JButton
```
. Diese Methode erwartet eine Instanz von
```
ActionListener
```
Klasse, die die Klasse ist, die auf das Ereignis wartet.
Als nächstes erstellen wir die Instanz von
```
ActionListener
```
Klasse durch Deklarieren eines neuen Objekts mit
```
neuer ActionListener ()
```
und dann eine anonyme innere Klasse bereitstellen - das ist der gesamte Code in den geschweiften Klammern.
Fügen Sie innerhalb der anonymen inneren Klasse eine Methode mit dem Namen hinzu
```
Handlung ausgeführt()
```
. Dies ist die Methode, die aufgerufen wird, wenn auf die Schaltfläche geklickt wird. Alles, was bei dieser Methode benötigt wird, ist die Verwendung
```
setVisible ()
```
um die Sichtbarkeit der zu ändern
```
JPanel
```
s.

Fügen Sie die JPanels zum JFrame hinzu

Schließlich müssen wir die beiden hinzufügen

s und

zum

. Standardmäßig a

verwendet den BorderLayout-Layout-Manager. Dies bedeutet, dass es fünf Bereiche (über drei Reihen) des gibt

das kann eine grafische Komponente enthalten (NORTH, {WEST, CENTER, EAST}, SOUTH). Geben Sie diesen Bereich mit dem an

Methode:

Stellen Sie den JFrame auf Sichtbar ein

Schließlich ist der gesamte obige Code umsonst gewesen, wenn wir den nicht eingestellt haben

sichtbar sein:

Jetzt können wir das NetBeans-Projekt ausführen, um das Anwendungsfenster anzuzeigen. Durch Klicken auf die Schaltfläche wird zwischen dem Anzeigen der Combobox oder der Liste umgeschaltet.