====== Schnellstart ====== Bevor wir uns Schritt für Schritt in die Bibliothek und deren Handhabung einarbeiten, soll ohne viel Erklärung einfach nur eine Grafik-Display-Anwendung erstellt und getestet werden. ====== Voraussetzungen ====== Damit der erste Test erfolgreich verläuft empfiehlt es sich, diesen mit den geeigneten Hard- und Softwarekomponenten durchzuführen. Es gilt: * die geeignete Hardware zu beschaffen, wir benutzen jetzt das [[http://shop.myavr.de/ARM-Produktlinie/myTouchOne%20-%20Color%20Grafic%20Touch%20LCD.htm?sp=article.sp.php&artID=200117|mySTM32F4 myTouch One Board]] * SiSy beschaffen und installieren, Sie können die [[http://sisy.de/index.php?id=59|DEMO]] oder eine [[http://shop.myavr.de/index.php?sp=artlist_kat.sp.php&katID=7|Vollversion]] nutzen ====== Neues Projekt anlegen ====== Schließen Sie das Experimentierboard an. Starten Sie SiSy und wählen //neues Projekt//. Geben Sie dem Projekt den Namen //uGL_Schnellstart//. >{{:1_willkommen_sissy.png?nolink&350|}} {{:1_neues_projekt.png?nolink&350|}} Wählen Sie das ARM Vorgehensmodell aus. Damit sind alle wichtigen Einstellungen für das Projekt und die darin enthaltenen Übungen als Default-Werte gesetzt. >{{:2_vorgehensmodell_waehlen.png?nolink&700|}} ====== Vorlage mit Beispiel laden ====== Das Grafik-Framework, Vorlagen und Beispiele werden aus dem SiSy LibStore online bezogen. Sobald Sie ein Projekt erstellt haben, bietet Ihnen SiSy geeignete Vorlagen aus dem LibStore an. Wählen Sie die Vorlage //microGL Framework//. Grenzen Sie die Liste ggf. mit dem Suchbegriff //"UGL"// ein. >>>>{{:libstoreugl.png?nolink&600|}} Nach dem Laden der Projektvorlage für das µGL-Framework erhalten Sie folgende Darstellung im Diagrammfenster. >>>>>{{::projektvorlageneu.png?nolink&500|}} Die Pakete enthalten im Wesentlichen zwei Bibliotheken. Das ist das //SiSy ARM C++ Framework// für den STM32 und das //µGL Framework//. Des Weiteren erhalten Sie zwei Klassendiagramme mit Grundgerüsten für Grafikanwedungen als Vorlage. Dabei wird zwischen Anwendungen mit und ohne GUI Komponenten der µGL unterschieden. ====== Firmware erstellen und übertragen ====== Die auf den ersten Blick einfachere Variante stellt eine einfache Anwendung ohne grafische Benutzeroberfläche dar. Öffnen Sie das //Grundgerüst ohne GL//. >>>>{{::openohnegl.png?nolink&300|}} Das Grundgerüst einer Grafikanwednung ohne GUI ist recht übersichtlich. Es enthält eine Applikationsklasse und deren Instanz. Diese aggregiert ein Display, welches die Realisierung eines konkreten Displaytreibers ist. >{{::ggohnegl.png?nolink&750|}} Die Operation //onStart// enthält exemplarische Befehle, welche elementare Funktionen des Displays ansprechen. >>>**onStart:** >>><code cpp> display.clearScreen(); display.setFont( fontSmallPlain ); display.drawText( 10,10,"Hallo Display"); display.setFont( fontMediumPlain ); display.drawText( 10,25,"Hallo Display"); display.setFont( fontLargePlain ); display.drawText( 10,45,"Hallo Display"); display.setFont( font7Segment ); display.drawText( 10,75,"123456789"); Rect r(20,150,200,100); display.drawRect(r); display.drawLine(20,150,220,250); display.setColor(RGB(90,90,200)); display.fillCircle(120,200,30); r.top=260; r.height=40; display.fillRectGradient(r,RGB(255,255,0),RGB(255,0,0),'v'); </code> Wählen Sie im Fenster Objektbibliothek das Aktionsmenü. >>>>{{::aktionsmenu.png?nolink&300|}} Mit dem Menüpunkt //Erstellen, Brennen Ausführen// wird das Werkzeug SiSy angewiesen, die Quellcodes für das aktive UML Klassendiagramm und alle genutzen Bibliotheken zu generieren, zu kompilieren, zu linken und auf den Mikrocontroller zu übertragen. >>{{::bildenerstellenbrennen.png?nolink&750|}} ====== Anwendung testen ====== Vergleichen Sie die Darstellung auf dem Display mit dem Quellcode der Operation //onStart//. >>>{{::beispielohnegl.jpg?nolink&300|}} ====== Videozusammenfassung ====== Geschaft, wir haben erfolgreich unsere erste Grafikanwendung erstellt, übertragen und getestet. Unsere Entwicklungsumgebung, bestehend aus Software und Hardware, funktioniert. Und hier diesen Abschnitt als Videozusammenfassung zum nochmal drüberschauen. >>><flashplayer width="600" height="475">file=http://youtu.be/0-BNb1UXmbA</flashplayer> >>>[[http://youtu.be/0-BNb1UXmbA|besser auf youTube]] ====== Nächstes Thema ====== * [[ugl_referenz|µGL Referenz]] * [[start|zurück zur Übersicht]]