====== GUI mit Netbeans ======
Diese Seite zeigt, wie man kochrezeptartig eine GUI in //Netbeans// mit realisiert.
Dazu gehen wir davon aus, dass ein GUI-Projekt erstellt wurde, wie es in [[https://ratsgymnasium-pe.de/ratsewiki/doku.php?id=faecher:informatik:netbeans:einfuehrung#projekt_mit_gui|in diesem Wiki]] erläutert wurde.\\
Wir gehen davon aus, dass das Projekt //guiProjekt// heißt (müsste neben der Kaffeetasse links oben stehen, wird beim Anlegen als Name gewählt).\\
Ebenfalls gehen wir davon aus, dass schon eine GUI hinzugefügt wurde, die den Namen //guiProjektGUI// hat (steht unter Source Packages -> <default package> und ist mit //guiProjektGUI.java// angegeben).

An der oberen Leiste des Projektes //guiProjekt// finden sich drei rechteckige Knöpfe namens //Source//((Quelle bzw. Quelltext)), //Design// und //History//.\\
**Für unsere alltägliche Programmierarbeit sind nur die beiden ersten von Belang.**\\
Klickt man auf //Design//, kann man interaktive Elemente in das Formularfeld ziehen oder daraus entfernen. Kurz: hier entwirft man das Design des Formulars. Allerdings initiiert man hier auch Interaktionsmöglichkeiten wie die Reaktion auf einen Klick mit der Maus auf einen Button.\\
Klickt man auf //Source//, so wird der Quelltext eingeblendet. Dort komplettiert man die im //Design// angelegten (Inter-)Aktionen.

===== die Bedienelemente =====
Ganz rechts finden sich die typischen Bedienelemente unter //Swing Controls//. In der folgenden Tabelle sind Name und typische Anwendung aufgelistet:
^Name ^Anwendung ^
|Label  |Überschrift, kurze Bedienungsanleitung, nicht editierbare Ausgaben |
|Button |Bedienknopf zum Auslösen von Aktionen |
|Text Field |einzeiliges, editierbares Textfeld für Eingaben, aber auch Ausgaben. Trotz des Namens auch für Zahlen |
|Text Area |mehrzeiliges, editierbares Textfeld für Eingaben oder Ausgaben |
|Slider |Schiebregler zum Festlegen eines (meist ganzzahligen) Zahlenwertes |

Auch die anderen Bedienelemente haben ihre Einsatzfelder. Für den Anfang werden diese hier sicher ausreichen.

===== notwendige Bedienelemente =====
Eine GUI sollte auf jeden Fall einen Knopf zum Beenden haben. Um das zu erreichen, klickt man auf //Design// und "zieht" einen Knopf (Button) am besten nach unten rechts in das Formular.\\
Der Knopf sollte seine Funktion selbst erläutern, weshalb man seine Beschriftung von //jButton1// (o.ä.) zum Beispiel auf //Beenden!// ändert. Das geht bei den Eigenschaften (Properties) des Knopfes unter //text//. Alternativ kann man mit der **rechten** Maustaste auf den Knopf klicken, was ein Menü öffnet. Dort klickt man auf //Edit Text//. Wir gehen davon aus, dass nun auf dem Knopf //Beenden!// steht.\\
Fakultativ, aber nicht unwichtig ist die Umbenennung des Knopfes. //Netbeans// hat die Eigenart, die zugefügten Bedienelemente unkreativ gemäß ihrer Art zu benennen und anschließend eine Nummer hinzuzufügen. So lautet die Variable, die unseren //Beenden!//-Knopf repräsentiert sehr wahrscheinlich //jButton1//. Das ist zwar zu Beginn ok, bei späteren Projekten aber mnemotechnisch optimierungsbedürftig (soll heißen, ich kann es mir besser merken, ob ein Textfeld //eingabeFeld// heißt als //jTextField3//). Um das zu beheben, klickt man mit der **rechten** Maustaste auf den Knopf und wählt //Change Variable Name ...//.\\
Buchstaben und Zahlen sind problemlos, Minuszeichen (und dergleichen) dagegen nicht. Ich nenne diesen Knopf gern //beendenKnopf//.

Nun der wichtigste Teil: Wir fügen dem //Beenden!//-Knopf Funktionalität hinzu, indem wir rechts auf //Events// klicken. Dort scrollt man nach unten, bis man //mouseClicked// findet. In der Zeile klickt man auf das nach unten zeigende schwarze Dreieck und wählt dort //BeendenMouseClicked// aus.\\
Darauf hin legt //Netbeans// eine neue //Methode// namens //BeendenMouseClicked// für das Formular an und springt in die entsprechende Zeile im Quelltext, sodass man dort die Funktionalität programmieren kann, die man beim Klicken des //Beenden//-Knopfes ausführen soll.\\
Wir fügen dort folgende Zeilen ein:\\

	int antwort = JOptionPane.showConfirmDialog(null, "Wollen Sie wirklich beenden?",
						    "Bestätigen", JOptionPane.YES_NO_OPTION,
						    JOptionPane.QUESTION_MESSAGE);
	if (antwort == JOptionPane.YES_OPTION)
		System.exit(0);

Erläuterung: Mit der ersten Zeile wird Speicherplatz für eine Ganzzahlvariable (int) namens //antwort// angefordert. Durch den Aufruf des Dialogs wird mittig auf dem Bildschirm ein kleines Fenster geöffnet, das abfragt, ob man das Programm wirklich beenden wolle. Das Fenster hat nur zwei Knöpfe: Ja und Nein. Je nachdem, was man klickt, liefert das eine Zahle zurück, die in der Variablen Antwort gespeichert wird.\\
In der nächsten Zeile wird abgefragt, ob letztlich die Antwort "Ja" lautete und in diesem Falle das Programm "verlassen", d.h. beendet.
===== Standardelemente =====
Nachdem unsere GUI nun schon wenigstens einfach beendet werden kann, fügen wir zwei Standardbedienelemente hinzu: Ein Textfeld und einen weiteren Knopf, auf dessen Klick hin das Textfeld ausgelesen wird.
==== Textfeld ====
Wir ziehen ein Textfeld in das Formular und benennen es erst einmal um:
  * Rechtsklick auf das Textfeld
  * Wähle //Change Variable Name ...//
  * Tippe "eingabeFeld"
  * Klicke //OK//

Damit haben wir eine Möglichkeit geschaffen, Eingaben vom Benutzer entgegenzunehmen. Der Benutzer unseres Programms tippt in das Textfeld.

==== Interaktionsknopf ====
Wir ziehen einen Knopf (vom Typ //Button//) in das Formular und benennen ihn erst einmal um:
  * Rechtsklick auf den Knopf
  * Wähle //Change Variable Name ...//
  * Tippe "aktionsKnopf"
  * Klicke //OK//

Wir ändern gleich die Aufschrift des Knopfes:
  * **einfacher** Klick auf den Knopf (zur Auswahl)
  * Klicke auf //Properties// am rechten Rand
  * Scrolle bis //text//
  * Klicke auf den rechts daneben stehenden Text und ändere ihn in "Aktion!"((Der text sollte je nach Programmieraufgabe/Projekt natürlich eine eingängigere Aufschrift bekommen.))

Zudem verknüpfen wir eine Methode/Prozedur/Funktion im Quelltext, die bei Mausklick auf den Knopf ausgeführt wird:
  * Klicke **einmal** auf den Knopf (um ihn auszuwählen)
  * Klicke rechts auf //Events//
  * Scrolle bis //mouseClicked//
  * Klicke auf das schwarze Dreieck
  * Wähle aktionsKnopfMouseClicked
===== Beginn aller Interaktion =====
Nach den beiden vorangegangenen Aktionen enthält unsere GUI nun das Textfeld namens //eingabeFeld// und den Interaktionsknopf namens //aktionsKnopf//.((Davon abgesehen gibt es noch einen Knopf, dessen Druck eine Abfrage bewirkt, ob das Programm beendet werden soll.))
Schließlich sollten wir uns nun im Quelltext an der Stelle befinden, die die Interaktion definiert. Das ganze sieht ungefähr so aus:
    private void aktionsKnopfMouseClicked(java.awt.event.MouseEvent evt) {                                          
        // TODO add your handling code here:
    }

Dort deklarieren wir eine Variable vom Typ **String**, die den Inhalt unseres Textfeldes aufnimmt. Zudem besteht die einzige Interaktion vorerst darin, diesen Inhalt am unteren Rand unverändert auszugeben. Sehen wir dort unsere Eingabe, so wissen wir, dass die Interaktion korrekt gestartet und unsere Eingabe korrekt übernommen wurde. Die Verarbeitung unserer Eingabe kann dann - abhängig von der konkreten Aufgabe - beginnen:
	String eingabe = jTextArea1.getText();
	System.out.println(eingabe);