In diesem Beitrag erklären wir dir die ersten Grundlagen dazu, wie man Programme auf dem Bildschirm visualisieren kann und welche Elemente man für die grafische Oberfläche verwendet.
Inhaltsübersicht
Dialoge zur Platzierung von Elementen
Um überhaupt Elemente platzieren zu können, brauchst du zunächst ein Fenster, fachsprachlich auch Dialog genannt. Es gibt aber nicht nur EINE Art von Fenster. Deshalb musst du dich erst einmal entscheiden, was dein Fenster für Eigenschaften haben soll.
Primärdialog und Sekundärdialog
Zunächst einmal gibt es den simplen Primärdialog, der der direkten Aufgabenerfüllung dient. Du kannst ihn dir ähnlich vorstellen wie den Editor.
Als nächstes gibt es den Sekundärdialog, der dich situationsabhängig mit Zusatzinformationen versorgt. Er wird immer aus einem Primärdialog heraus gestartet und du kannst ihn dir ähnlich vorstellen wie den „Speichern Unter Dialog“ deines Schreibprogramms. Nach seiner Beendigung wird der Primärdialog fortgesetzt.
Studyflix vernetzt: Hier ein Video aus einem anderen Bereich
Nicht-modale und modale Dialoge
Außerdem unterscheiden wir zwischen nicht-modalen und modalen Dialogen. Modale Dialoge müssen beendet werden, damit ein anderes Fenster aktiviert werden kann, nicht-modale können unterbrochen werden. Damit wäre ein Beispiel für den modalen Dialog das bereits erwähnte „Speichern Unter“, ein Beispiel für einen nicht-modalen Dialog die Suchfunktion deines Dateibrowsers.
RGB-Prinzip und Schrift
Die Farben erzeugen wir nach dem RGB-Prinzip. Das heißt, wir erzeugen die Farbe mittels Konstruktor und geben drei Werte zwischen 0 und 255 an, wobei der erste für rot, der zweite für grün und der dritte für blau steht.
Willst du nur Graustufen erzeugen, so setzt du einfach alle drei Parameter auf denselben Wert.
Aber wir wollen ja nicht nur ein leeres Fenster erzeugen, sondern es auch mit etwas füllen. Deshalb fügen wir jetzt eine Schrift hinzu.
Diese erzeugst du wie die Farbe mit einem Konstruktor. Als ersten Parameter gibst du den Namen der gewünschten Schrift ein, wobei wichtig ist, dass diese auch installiert ist. Der zweite Parameter ist der sogenannte Font Style. Dieser kann entweder Fett, kursiv oder normal sein.
Als dritten und letzten Parameter gibst du die Schriftgröße an.
Erzeugung von grafischen Komponenten
Um das Fenster jetzt auch irgendeinen Zweck erfüllen zu lassen, braucht es noch grafische Komponenten. Denn mit diesen kann der Benutzer, sobald eine Ereignisbehandlung implementiert ist, per Maus oder Tastatur interagieren.
Dabei sind grafische Komponenten, so wie alle anderen Objekte, abstrakt. Sie werden jedoch durch reale Abbilder, die sogenannten „peers“ grafisch dargestellt. Bei der Software-Entwicklung für eine konkrete Plattform werden diese meist vom Betriebssystem erzeugt. Bei Java gibt es allerdings auch die Möglichkeit, sie vom Runtime Environment erzeugen zu lassen.
Wenn wir die Elemente durch das Betriebssystem erzeugen lassen, können wir das Abstract Windowing Toolkit, kurz AWT, nutzen. Denn dieses setzt zur Implementierung der peers die nativen Methoden des Betriebssystems ein. Das führt allerdings dazu, dass die Darstellung der fertigen Software auf verschiedenen Plattformen sehr unterschiedlich ausfallen kann. Da meist ein einheitliches Erscheinungsbild der Software gewünscht ist, damit diese Wiederkennungswert besitzt, greift man bei plattformübergreifender Entwicklung meist auf SWING zurück.
Komponenten, die mit AWT erzeugt wurden, gehören zu den heavyweight components, da sie vom Betriebssystem erzeugt werden, im Gegensatz zu Komponenten, die mit SWING erzeugt wurden. Diese nennt man lightweight components, da sie Plattformunabhängig von SWING selbst gezeichnet werden.
Nun weißt du, welche grundlegenden Komponenten dir zur Verfügung stehen, um ein GUI zu erzeugen. In den nächsten Beiträgen gehen wir noch tiefer in die Materie.
GUI-Elemente – Grundlagen — häufigste Fragen
(ausklappen)
GUI-Elemente – Grundlagen — häufigste Fragen
(ausklappen)-
Was ist GUI?Eine GUI („grafische Benutzeroberfläche“) ist die sichtbare Oberfläche eines Programms, über die man mit Fenstern, Texten und Bedienelementen arbeitet, statt nur Eingaben in der Konsole zu tippen. „Grafisch“ bedeutet, dass Informationen und Steuerung am Bildschirm dargestellt und angeklickt werden.
-
Was sind grafische Elemente?Grafische Elemente sind die sichtbaren Bausteine einer grafischen Benutzeroberfläche, die in einem Fenster platziert werden, zum Beispiel Buttons, Textfelder, Beschriftungen oder Listen. Man nutzt sie, damit der Benutzer Informationen sieht und per Maus oder Tastatur mit dem Programm interagieren kann.
-
Was ist ein Beispiel für eine grafische Benutzeroberfläche?Ein Beispiel für eine grafische Benutzeroberfläche ist das „Speichern unter“-Fenster in einem Schreibprogramm, in dem man einen Dateinamen eingibt und auf „Speichern“ klickt. Solche Fenster zeigen Inhalte und Schaltflächen und reagieren auf Eingaben, ohne dass man Befehle in eine Konsole schreibt.
-
Was ist der Unterschied zwischen GUI und UI?Eine UI (User Interface) ist jede Benutzerschnittstelle, über die man ein System bedient, egal ob grafisch oder textbasiert. Eine GUI ist speziell eine grafische UI, bei der man mit Fenstern und Bedienelementen auf dem Bildschirm arbeitet.
Nach Beantwortung speichern wir deine Antwort, um Studyflix zu verbessern. Mehr dazu erfährst du in unserer Datenschutzerklärung.
Benutzeroberflächen verstehen
GUI-Elemente gehören zu den Grundlagen von Benutzeroberflächen und machen Programme auf dem Bildschirm nutzbar. Wer sich mit Benutzeroberflächen beschäftigt, ordnet Fenster, Eingaben und Ausgaben in ein gemeinsames System ein. So wird klar, wie Aufbau, Aussehen und Bedienung einer Anwendung zusammenhängen. Im Informatikbereich findest du passende Videos zu diesem und verwandten Themen.