Herzlich willkommen zur nächsten Vorlesung, bei der wir uns mit
der grafischen Nutzeroberfläche beschäftigen und dabei einen nächsten Baustein aufbauen,
zum Baueignersysteme, zum Entwurf größeres System.
Wir erwarten, haben wieder Fragen dazu, wie immer,
und führen dabei auch gleichzeitig Lampdarausdrücke ein, das ist etwas Funktionales,
die letzten Vorlesungen ist ja behandelt, das funktionale Programmierparadigma.
Ja, wir hatten aufgesetzt und orientieren uns dran an der Methode,
wann Werkzeugautomat Material und orientieren uns an der Struktur,
die man, wenn bei Envendung dieser Methode, Systemen gibt.
Wir gliedern das System aus vier Elementhypen, Materialien,
wo drin steckt, was bearbeitet wird,
Fachwerte, unveränderliche Dinge, die fachlich sind, Werkzeuge,
das wurde mit der Mensch kommuniziert, die Interaktion und Services,
das, was die eigentliche Arbeit macht, was Dienstleistungen macht.
Und da gab es Sichtbarkeitsregeln, die haben wir beim letzten Mal behandelt.
Und was wir machen wollen, ist nun, dort fortsetzen.
Wir haben, wir wissen, dass die Werkzeugklasse Das Material bekommt über den Konstruktor.
Das hatten wir beim letzten Mal besprochen. Und die Werkzeugklasse
bekommt die benötigten Services ebenfalls als Konstruktor, Parameter.
Ja, und dann erzeugt die Werkzeugklasse die Werkzeugklasse zwei wesentliche Klassen.
Und eins davon ist die UI-Klasse, das User Interface.
Und damit setzen wir fort heute die UIs-Klasse,
die kümmert sich um die grafische Benutzeroberfläche, die Komponenten,
die Layout,
die zu verwalten ist
Und dazu schauen wir uns an, und dazu verwenden wir,
dass wir beim letzten Mal über Entwurfsmuster,
über das Beobachtermuster gelernt hatten und gleichzeitig strukturieren,
wie strukturieren wir grafischer Benutzeroberflächen.
Wiederum möchte ich einhaken bei dem,
was Sie von Anfang an immer von mir hören,
wir entwickeln große Systeme und Systeme, die sich verändern müssen.
Solche Veränderungen sind ganz verschiedenartig, ja, dieses Sprichwort,
nichts ist so beständig wie der Wendel, sagt das.
Diese Änderungen sind nicht nur Technologieänderungen,
dass also ein Windows-Update gibt oder ein Datenbank-System-Update oder sowas.
Nein, es sind ganz häufig auch fachliche Änderungen. Der Auftraggeber möchte sein System,
seine Prozesse optimieren und da muss die Software das auch optimieren.
Und wir wollen das User-Interface ändern, weil andere Dinge
jetzt schön gefunden werden, weil sich die Meinung ändern,
weil wir es einfach irgendwie aufhübschen möchte.
Ja, also all solche Aspekte spielen hier eine Rolle.
Wesentlich ist, die passieren in unterschiedlichen Zyklen. Werden Technologieänderungen
so schleichend passieren und manchmal lässt man auch Updates aus,
passieren fachliche Änderungen sehr dringend, der Auftraggeber und der Die Benutzer haben sich irgendwas ausgedacht.
Sie wollen ja einen Prozess ändern und sie müssen ihn ändern.
Zum Beispiel auch manchmal, weil wir setzliche Änderungen zutreffen,
dann muss das sofort passieren. Urser Interface ist vielleicht ein bisschen eher geplant,
dafür weniger klar, wo die Richtung hingehen soll.
Also unterschiedliche Zyklen. Wenn wir das,
was wir schon immer gesagt hatten, oder was ich von mir,
was sie von mir immer schon mehrfach hören,
wir müssen das Ganze trennen, wir müssen sauberes System,
sauberes Systemgestaltung machen.
Und dazu für diese Trennung schlagen wir vor,
das Fachliche vom Technischen zu trennen und das Fachliche von
der Gui
zu trennen
Vorteil davon ist, dass Änderungen sich nicht so weit ausbreiten.
Ja, also dass Änderungen sich nur auf den Teil beziehen,
wo sie wirklich hingehören und andere nicht. Zum Beispiel,
das wird Präsentation mit der und Handhabung von der Funktionalität drin.
Das fachliche Funktionalität ist zwar auch fachlich,
aber hier steckt die Guide drin und hier nicht.
Hätte den Vorteil, dass wir die fachliche Operation nicht
bearbeiten müssen, nur weil wir die Guide bearbeiten.
Bei jeder Bearbeitung einer Methode einer Klasse können Fehler passieren
Und am besten wir beschränken das immer auf die Notwendigen.
Und wenn wir ihr mit den unterschiedlichen Zyklen Technologieklassen haben,
weil sie halt technisch und fachlich getrennt ist,
dann ändern sie sich nur bei der ersten Gelegenheit.
Fachliche Klassen ändern sich nur bei der zweiten Gelegenheit.
Und die Gui-Änderungen, die passieren dann eben auch zu einer anderen,
wieder einer anderen Zeit. Und die wieder begrenzt auf die Gui.
Das ist auch das, was wir in Frage 1 haben.
Ich springe mal zurück zur Folie 2. Wir kommen gleich wieder hierher.
Ja, also Frage 1, warum ist die Zerlegung in
fachliche und technische Anteile vorteilhaft für die Änderbarkeit?
Ja, und diese vorteilhaft ist das, weil es unterschiedliche Zyklen sind.
Dadurch sind wir weniger, haben wir weniger Änderungen.
Weniger häufige Änderungen
Ja, soweit zu den Änderungen. Und wir haben hier
gleich noch eine weitere Frage gehabt. Gleich nochmal zurück.
Die zweite Frage können wir ja auch gleich mit der Folie beantworten.
Welche Teile interaktiver Systeme können durch ein Gui-Framework realisiert werden?
Die Teile interaktiver Systeme, die hatten wir ja hier gesehen,
ja, die Folie vorher noch, nein, noch eine vorher.
Das war diese hier, was ist hier, hier ist sie weiter.
Ja, also das sind die Teile interaktiver Systeme, Werkzeugservicematerial,
Fachwert. Und wir hatten jetzt Das Werkzeug nochmal zerlegt,
mindestens zwei Klassen, also von dir so,
da kannst du auch mehrere geben, User in der Face-Klasse und Werkzeugklasse.
Und diese User in der Face-Klasse, das ist das,
was wir bei der, durch ein Gummi-Framework irgendwie unterstützen können.
Ja, diese Gummi-Frameworks sind sozusagen vorgefertigte Bausteine für grafische Nutzeroberflächen, für die baugrafische Nutzeroberflächen.
Und diese gibt es für verschiedenen Betriebssysteme von verschiedenen Herstellern,
gibt es so ein Zeug,
zum Beispiel die Windows API oder die Macintosh-Coolbox oder Antroid,
das Betriebssystem, das iOS User in the Face Kit.
Sie hören hier schon den Namen raus, die sind alle sehr plattformspezifisch.
Das heißt, sie nutzen die Funktionen und die Möglichkeiten,
die so eine Plattform bietet. Sie folgen der Entwurfsphilosophie dieser Plattform.
Und zum Beispiel bei Java bei Windows 10 gerade dieses Kacheldesign,
bei mobilen Geräten, Wischtechnik und sowas. Also deswegen sind die folgen die dieser Metapher nicht unbedingt objektloiniert, das muss man sagen. Für Java möchte ich,
möchte ich diese vier sehr etablierten Toolkids nennen, AWT,
Abstract Windowing Toolkid, ihre einfache Elemente swingen, ergänzt und erweitert dieses AWT,
das ist eher fortschrittlich, beide sind schon etwas älter,
Guti, Jumpy ist in 2&C plus plus geschrieben,
aber hat eine Yavi-API und dann haben wir Java FX,
das ist, wenn sie so wollen, der Nachfolger von Swing,
moderneres Look on Feel, aber wir müssen sagen,
es hat sich noch nicht so etabliert.
Wir haben für diese Lehrveranstaltung regelmäßig diskutiert,
ob wir denn zwingend mal ablesen, ablösen,
aber wir haben uns weiterhin entschieden,
hier in dieser Veranstaltung AWT und Zwing zu behandeln,
weil das die am meisten verbreiteten Tool-Kids sind und ja,
weil ich es halt bis jetzt einfach nicht die Verbreitung erreicht.
Dieser Tool-Kids unterstützen alle die Trennung von Präsentation und Funktionalität,
weil sie eben für die Präsentation
Bausteine benutzen
Ziehen und die Fremdworks als solches sind erstmal Plattformen unabhängig.
Das heißt, es existiert für die verschiedenen Blatt-Toolkits,
entsteht eine Übersetzung auf die verschiedenen Plattformen.
Und damit ist es leichter zu portieren, wenn man so
ein Fremdwork benutzt. Ja, und genau,
wir haben Objekte und täte Schnittstellen vor diesen Frameworks,
hat den Vorteil,
dass wir nicht nochmal eine Technologiewechsel haben zwischen unserem Anwendungsprogramm,
was objektorientiert ist und dem grafischen nur zur Oberfläche.
Objektorientiert ist
Wie schauen wir uns sowas an? Was sollte man
ganz leicht beginnen? Also Hello World mäßig, ja,
Look and Feel. Wir wollen einen Knopf mit einem Text
und da soll etwas passieren. Ja, und zwar soll,
wenn der Knopf gedrückt wird, der Zähler hochziehen.
Und da entsteht natürlich die Frage vor uns,
wir haben die Java-Bibliothek zwingen, wollen wir jetzt mal ausprobieren,
wollen wir nutzen mit sowas ganz Einfachem?
Und nur hier drücken und hochziehen lassen. Und dann
wollen wir dazu mal schauen, was bietet Swing dazu?
Wie können wir das verbinden mit Sachen,
die wir sowieso machen
Und wie, was für Möglichkeiten für das Layout gibt es also
wie mächtig, ist dieses Swing. Jetzt zwei Folien,
wo ich Ihnen die ganzen Elemente von Swing und AWT darstelle.
Wir fangen mal hier von an, das ist etwas Statisches,
ein Label. Label kann eine Grafik ergänzen. Wir haben
also hier ein Stück Text, was wir dann beschreiben können,
was das tut, das kann eine Firmenlogo sein oder was
auch immer
Button. Ja, da haben wir Checkbutton,
da kann ich ein- oder alles machen, Radio-Button,
da kann ich eine 1 aus N-Auswahl machen und dann haben wir so einen Okay-Knopf.
Ja, das sind, das sind Button. Nächste Kategorie,
aus denen ich, aus jedem dieser Dinge kann ich etwas,
die kann ich nehmen, kann einfach die Klassen dazu aufbenutzen,
kann die Eigenschaften verändern, also hier zum Beispiel,
welche, ich möchte, hier kann ich die Farbe,
die verändern den Text natürlich sowieso, die Hintergrundfarbe.
Ja, hier sind Textfelder,
diese Textfelder sind nicht zur Bearbeitung,
nicht zur Eingabe gedacht
Zur Eingabe ist dieses Text Area gedacht.
Ach nein, hier kann ich doch eine Eingabe machen.
Das war falsch hier, kenne ich die Eingabe einseilig machen.
Hier kann ich die Eingabe als Textfeld machen und kann da mit einem Zeilenumbruch arbeiten.
Hier kann ich aus deiner Liste auswählen, diese Liste ist komplett dargestellt.
Ich habe hier so einen Schiebebalken, wie der Schiebebalken genau aussieht.
Das ist sehr abhängig vom Betriebssystem, das stört das Betriebssystem.
Hier haben wir, das nennt sich Combobox,
das ist normalerweise nur so ein einseitiges Element,
aber das Dreieck sagt uns,
ich kann hier was aufklappen
Die, ob das genauso ein Viereck ist,
so grau, das hängt sehr davon ab, wieder,
was es für ein, für ein Beriebssystem ist.
Immer angepasst, die Elemente sind immer angepasst an das Betriebssystem,
aber die Combo-Box hat die Eigenschaft,
ich sehe normalerweise nur eine Zeile,
wenn ich aber hier draufdrücke, kann ich aus mehreren auswählen,
aber dann zum Beispiel der Freitag dargestellt.
Ja, dann haben wir noch Scrollpain, also ein Fenster,
wo ich senkrecht und quer scrollen kann bei Bedarf.
Das kann ich dann auch so steuern,
dass ich ab einer bestimmten Größe dann erst scrollen kann,
wenn ich im Bildschirm,
wenn ich das betreffende Fenster
insgesamt größer mache
Ein Slider, mit dem ich etwas einstellen kann,
Toolkit, Tooltipp, sorry, Tooltipp, ist also etwas,
was aufschaut, wenn ich mit der Maus dahin gehe.
Fortschrittsbalken, Toolbar, dann gibt es so eine Baumdarstellung,
mit der ich Elemente aufklappen kann. Und das tappt Pain,
auch wiederum hier, ob das jetzt grau ist wie hier
mit Auswahl oder ein bisschen anders, das hängt vom Betriebssystem ab,
das können wir in anderen Betriebssystemen,
kann das anders aussehen.
Hier ist jetzt
eine typische Java-Darstellung
Wir sehen oben noch so ein Stückchen Menü und
dann drunter die Fenster, haben eigentlich solche Retabulatorentaps.
Damit habe ich die Möglichkeit zum Beispiel Eingaben parallel zeitgleich zu unterstützen,
dass sie gemeinsam in gemeinsamen OK-Knopf haben.
Der OK-Knopf, den nehme ich von Button und das Tab-Pain
, das nehme ich dann von hier.
Ja, es gibt natürlich auch Tabellen, Tabellen mit erstmal einfacher Funktionalität.
Es gibt noch andere Klassentheken oder Klassen,
wo ich dann komplizierterer Bibliothek bekomme wegen mit Umbruch,
mit Verschiebemöglichkeiten,
mit Sortiermöglichkeiten oder sowas
Ein Splitpain ist also ein Fenster, wo ich links Ordner
darstellen kann und rechts die Inhalte oder Dateien und die Inhalte.
Das hängt ein bisschen davon ab, was ich machen möchte.
Wie ist es konfiguriere? Menü hat man schon mal gesehen
. Hier ist das Menü zur Auswahlmöglichkeit. Das ist,
und wir haben um die Möglichkeit, zwei Übertabs,
zwei verschiedene Dinge hier das Stück zu stellen.
Auf der nächsten Folge geht es weiter. Und zwar zunächst
erst mal größere Elemente, die gleich mit einem Rahmen konnten.
Fangen wir mal hier an
Option Pain, wo wir einfach nur eine Meldung bekommen,
die wir auswählen können. Eine Warning, da kann ich
nichts auswählen, da kann ich nur drücken und bestätigen.
Es gibt auch noch einen Dialog, wo ich noch was eingeben kann oder mit einer Bestätigung.
Hier sehen Sie, es gibt auch eine Abbruchmöglichkeit. Ja,
der allgemeine Rahmen, der sehr davon abhängt,
wie das Prinzipssystem aussieht, also im Windows wurde das hier anders aussehen,
dass wir hier mitschließen,
Vollbild und Und in die Statusleiste hier eine Eingabe,
Dialog mit OK-Knopf, hier gleich ein komplexeres Ding,
wo ich Farben wählen kann.
Und hier File-Chooser, ein komplexeres Ding, mit dem ich
Dateien auswählen und bearbeiten kann. Das sind alles Elemente,
die Swing mit uns bringt, mit sich bringt.
Und damit können wir sehr flexibel Tools zusammenbauen. Dinge,
die nicht reichen, zum Beispiel, hatte ich gesagt,
die Tabelle ist hier ziemlich einfach.
Die müsste man dann selbst bauen oder mit dem C aus
einer anderen Bibliothek. Soweit erstmal zu den,
zu den GoElementen mitzwingen