Programmieren mit C-Sharp, Teil 4 Grafische Benutzeroberflächen für C# erstellen
In Visual Studio lassen sich mit dem Formdesigner und der Toolbox alle Arten von grafischer Oberfläche auf Basis von C# recht einfach erstellen. In diesem Beitrag zeigen wir die Vorgehensweise.
Anbieter zum Thema

Um in Visual Studio ein Programm auf Basis von C# zu entwickeln, das über ein Graphical User Interface verfügt, reicht die kostenlose Community Edition der IDE aus. Zusätzliche Funktionen bieten die Editionen Professional und Enterprise.
Für die Entwicklung eines Programmes mit grafischer Oberfläche wird ein neues Projekt mit „Windows\.NET Desktopentwicklung“ erstellt. Anschließend gilt es noch, den Punkt „Windows-Forms-App (.NET Framework)“ auszuwählen.
Das Erstellen der Benutzeroberfläche gelingt über die Toolbox, die eventuell über den linken Bereich eingeblendet werden muss. Ist sie auch hier nicht zu finden, muss die Toolbox über den Menüpunkt „Ansicht“ in Visual Studio aktiviert werden. Die Toolbox kann im Fenster frei platziert werden, lässt sich aber auch an eine Stellte außerhalb des Visual Studios Fensters verschieben.
Das Formular, das als grafische Oberfläche dient, wird automatisch im Editor angezeigt. Rechts unten ist das Eigenschafts-Fenster zu sehen. Das ist ebenfalls wichtig, um die Elemente, die in die grafische Oberfläche gezogen werden, zu bearbeiten. Auch dieses Fenster ist über den Menüpunkt „Ansicht“ zu finden und kann frei platziert werden.
Einstieg in die Erstellung einer grafischen Oberfläche in Visual Studio
Wer mit C# in Visual Studio entwickelt, muss für eine GUI in der Regel keinen Code eingeben, sondern kann direkt mit dem Formdesigner und der Toolbox arbeiten. Hier lassen sich alle Objekte, die benötigt werden, sehr einfach integrieren. Erstellt wird die grafische Oberfläche mit dem Formdesigner, einzelne Elemente lassen sich per Drag and Drop in die Toolbox ziehen, der Code wird am Ende automatisch generiert.
Natürlich besteht dennoch die Möglichkeit, direkt in den Code von C# einzugreifen, bei statischen Oberflächen ist das allerdings nicht oft vonnöten. Sollen aber dynamische Elemente erstellt werden, muss man den Code schon häufiger manipulieren. Veränderungen sollte man aber bestenfalls nur dann vornehmen, wenn man sich der Auswirkungen bewusst ist.
Erstellen einer grafischen Oberfläche mit dem Formdesigner
Beispiele für GUI-Elemente sind Buttons und Labels, deren Eigenschaften sich über den entsprechenden Bereich am rechten unteren Rand noch anpassen lassen. Dabei zeigt das Eigenschaftsfenster immer die Eigenschaften jenes Objektes an, das aktuell ausgewählt ist. Dies gilt selbstredend auch für das komplette Formular, wenn es angeklickt wird.
Die Ansicht wird über die Symbole im Eigenschafts-Bereich angepasst. Hier lassen sich zum Beispiel alle Elemente alphabetisch sortiert oder in Kategorien unterteilt anzeigen. Beim Bearbeiten der Eigenschaften stehen entweder verschiedene Optionen zur Verfügung, wie zum Beispiel „True“ oder „False“, oder es lassen sich freie Texteingaben vornehmen.
Einige Eigenschaften ermöglichen darüber hinaus eine erweiterte Steuerung, die über ein neues Fenster vorgenommen wird. Das hängt schlussendlich von dem jeweiligen Objekt an, das für die grafische Oberfläche angepasst werden soll und der Eigenschaft deren Anpassung vorgenommen wird. Auf diesem Weg lassen sich mehrere Elemente in die Oberfläche ziehen.
Der Formdesginer hilft dabei, die Ausrichtung optimal vorzunehmen, indem Hilfen eingeblendet werden, die bei der Zuordnung der Objekte in Bezug zueinander helfen. Dabei kann es sich auch um gleichartige Objekte handeln, zum Beispiel mehrere Buttons. Diese lassen sich auch gemeinsam bearbeiten. Dazu müssen die entsprechenden Objekte bei gedrückter STRG-Taste markiert werden. Anschließend sind alle Eigenschaften zu sehen, die für alle ausgewählten Elemente gleichzeitig angepasst werden können.
Festlegen von Aktionen für Elemente in der grafischen Oberfläche
Die Elemente lassen sich dabei nicht nur grafisch anpassen, in den Eigenschaften finden sich auch die darüber getriggerten Aktionen, also beispielsweise, wenn ein Anwender einen Button mit der Maus anklickt. Dazu wird in den Eigenschaften bei „Aktion“ ausgewählt, welche Aktion durchgeführt werden soll.
Hierzu wählen wir zunächst den Button aus und klicken danach auf das „Text“-Feld in den Eigenschaften, um die Schaltfläche selbst sowie ihren Namen anzupassen. Dieser Name wird im Code von C# ebenfalls übernommen und ist damit auch direkt von anderer Stelle zugreifbar. Per Doppelklick auf den Button oder das Objekt zeigt Visual Studio den entsprechenden Code an.
Durch die Eingabe eines Buchstabens im Code, an der Stelle, die automatisch markiert wird, können Befehle integriert werden, die beim Anklicken des Objektes ausgeführt werden. Ein Beispiel dafür ist „Messagbox“. Durch Eingabe von „.“ Lassen sich Methoden auswählen, zum Beispiel „show“. In Klammern wird der Text eingegeben, der angezeigt werden soll, zum Beispiel („Hallo Welt“). Die Zeile muss mit Semikolon beendet werden. Der Befehl sieht dann folgendermaßen aus:
MessageBox.Show(„HalloWelt”);
(ID:46107998)