====== Klasse erweitern ====== Öffnen Sie ggf. das Paket //MeineBildschirme//. >>>{{:inneuemfenster.png?direct&300|}} Ergänzen sie das Klassendiagramm wie folgt: * neue Klassen //OptionsForm// und //HelpForm// anlegen mit: * Attribut: //name// vom Typ //UglText// * Operation: //onInit// überschreiben der gleichnamigen Operation der Basisklasse * die Klassen //OptionsForm// und //HelpForm// sind Realisierungen des Templates //UglForm// * Verbinden Sie die Klasse //StartForm// über eine gerichtete Assoziation mit den neuen Klassen. >>>{{::kdneuebs.png?direct&700|}} ====== Quelltext vervollständigen ====== Wechseln Sie in das Klassendiagramm der Anwendung. Falls die Klasse Navigator noch nicht über eine Operation //onEvent// verfügt, ergänzen Sie diese bitte durch Überschreiben der gleichnamigen Operation der Basisklasse. Der Navigator ist eine spezialisierte //UglForm// Form vom Typ //UglNavigator//. Der Navigator wird standardmäßig als Fußzeile angezeigt. Die Button auf dem Navigator können durch die jeweils aktive Form festgelegt werden. Die Instanz dieser Form ist immer als Attribut der //GUI// oder globales Objekt verfügbar. Ergänzen Sie die Operationen wie folgt: >>>{{::navigarorevents.png?direct&350|}} Der Navigator reagiert also auf die Ereignisse mit den IDs //'h', '?', 'o'// und //'x'//. Dabei werden je nach Ereignis die Formen //StartForm//, //HelpForm// und //OptionsForm// geladen. Beim Ereignis 'x' wird an die //GUI// die Nachricht //goBack// gesendet. Diese //GUI// merkt sich, welche Formen zuletzt geladen wurden und kann diese über die Opreation //goBack// erneut laden. Wechseln Sie wieder in das Paket //MeineBildschirme// und ergänzen Sie die Operationen der neuen Klassen wie folgt: >>>**StartForm::onInit** >>><code cpp> // NEU: die Navigator-Button festlegen, Erstes Zeichen=ClickEvent an Navigator navButtons = " |oOptions|?Help|xExit"; dim_t width = 200; Rect r( 10, 5, width, 0 ); txtWelcome.createControl(this, r, "Willkommen" ); r.top += r.height + Margin; r.height = 0; // default -> PA, Höhe passt sich automatisch an btnTest1.icon = iconBright_20; btnTest1.createControl(this, r, "Drück mich!" ); btnTest1.clickEvent = 0x55; </code> >>>**NextForm::onInit** >>><code cpp> // NEU: die Navigator-Button festlegen, Erstes Zeichen=ClickEvent an Navigator navButtons = "hHome|oOptions|?Help|xExit"; Rect r(20,20,100,20); name.createControl(this,r,"Beispielseite"); r.top+=30; btnEnde.clickEvent='e'; btnEnde.createControl(this,r,"Ende Next"); </code> >>>**OptionsForm::onInit** >>><code cpp> // NEU: die Navigator-Button festlegen, Erstes Zeichen=ClickEvent an Navigator navButtons = "hHome|oOptions| |xExit"; // Name der Seite anzeigen Rect r(20,20,100,20); name.createControl(this,r,"Einstellungen"); </code> >>>**HelpForm::onInit** >>><code cpp> navButtons = "hHome| |?Help|xExit"; // Name der Seite anzeigen Rect r(20,20,100,20); name.createControl(this,r,"Hilfeseite"); </code> ====== Testen ====== Erstellen und übertragen sie das Programm auf den Mikrocontroller. Wenn Sie das Paket //MeineBildschirme// als neues Fenster geöffnet haben, können Sie jetzt zwischen den Fenstern umschalten um die Anwendung zu erstellen. Oder sie betätigen auf dem Titel-Tabulator der Anwendung die rechte Maustaste und erhalten dort das Aktionsmenü des entsprechenden Diagramms. So können Sie die Anwendung auch ohne Umschalten der Fenster erstellen. >>>{{::taberstellenbrennen.png?direct&400|}} Testen Sie die Funktion der Schaltflächen und vergleichen Sie das Ergebnis mit dem Quelltext. >>>{{::starformnav.jpg?direct&250|}} {{::nextformnav.jpg?direct&245|}} >>>{{::optformnav.jpg?direct&250|}} {{::helpformnav.jpg?direct&250|}} ====== weiter mit ====== * [[http://myugl.de/_wiki/doku.php?id=neue_bildschirme_mit_der_ugl_erstellen#realisierung_der_neuen_bildschirme|Übersicht der Entwicklungsschritte]] * [[http://myugl.de/_wiki/doku.php?id=neue_bildschirme_mit_der_ugl_erstellen#videozusammenfassung|Videozusammenfassung]]