Flutter, Dart und mehr !

  Vor kurzem habe ich schon einige Posts über Listen in Dart online gestellt. Ein verwandtes Thema sind Generics in Dart. Verwandt deshalb, weil Listen eine Möglichkeit sind, eine Datensammlung zu bearbeiten. Eine Datensammlung wiederum kann verschiedene Typen enthalten.  Generics wiederum sind ein Ansatz mit solchen Typen umzugehen, wie zum Beispiel Integer oder String . Bevor wir aber in das Thema einsteigen ein kleines Vorwort: Vielleicht gehören Sie zu den Programmierern, die praktisch alles zu der verwendeten Sprache auswendig wissen. Dann Gratulation :-) !! Bei den meisten ist das nicht der Fall. So gehört ein Blick in die Dokumentation der Entwickler, oder die Verwendung von anderen Informationsquellen im Internet, für viele dazu.  Dart ist eine objektorientierte Programmiersprache und deshalb werden Sie früher oder später auf Generics treffen. Sie zu verstehen ist wichtig, um Dart richtig verwenden zu können. Erstes Beispiel Im Beispiel links, sehen Sie eine D...

Photo by  Paweł Czerwiński  on  Unsplash Im zweiten Post zum Thema Stream's hatten wir ja ein Diagramm, welches die "Welt der Stream's" in Dart dargestellt hat. Wir haben ausserdem gesehen, das wir mit async, async* und await Streams programmieren können , ohne die Library Funktionen direkt benutzen zu müssen. Streams und Future's in Dart sind nahe beieinander liegende Themen. Man muss aufpassen, das keine Verwirrung entsteht. Stellen wir einen Vergleich an: Sie sind ähnlich da.. : Beide arbeiten asynchron (Stream's meistens, nicht immer). Beide tragen einen potenziellen Wert. Sie sind sich nicht ähnlich da..: Ein Stream eine Kombination von Future's ist Ein Future nur immer eine Antwort hat, ein Stream hat in der Regel eine nicht begrenzte Anzahl von Antworten. StreamController Beginnen wir mit der Funktion erschaffeStream(...) .Der komplette Code am Schluss, hier zuerst einen Part nach dem anderen: StreamController < n...

Photo by  veeterzy  on  Unsplash Im ersten Teil zu Stream's in Dart haben wir erste Schritte in dem Thema unternommen. Wir erinnern uns, ein Stream, einen Strom also, kann man sich als Fluss vorstellen. Er hat eine Quelle, die ihn fortwährend mit Wasser speist. Im letzten Post war die Quelle eine Funktion mit der wir Zeichenketten in diesen Fluss eingespeist haben. Der Vergleich mit einem Fluss aus der realen Welt endet hier. Wichtig ist: Wir haben es mit einem fortwährenden Strom von Daten zu tun, die wir manipulieren können. Das Thema Stream's in Dart ist sehr umfangreich und man läuft Gefahr vor lauter Bäumen den Wald nicht mehr zu sehen. Beginnen wir deshalb einfach: Stream Laut Dokumentation ist Stream eine Sequenz an Ereignissen, das kann ein Daten Ereignis sein, oder ein Fehler Ereignis. Einfach ausgedrückt, jedesmal wenn wir einen Stream auslesen, enthalten wir entweder Daten oder eine Fehlermeldung. Im Sprachgebrauch von Dart "hört" man auf...

Ich weiß nicht, wie es anderen Leuten geht. Ich persönlich lerne auch durch Wiederholung und selbstverständlich auch durch Fehler. So hoffe ich auf jeden Fall... Wie auch immer, in Flutter ist Statemanagement ein großes Thema.  Es gibt verschiedene " Pattern " dafür, d.h. Vorschläge für Lösungsmustern, wie man mit State umgehen soll. Sehr oft werden sie durch Librarys unterstützt, die Funktionen zur Verfügung stellen, um diese Muster in Flutter um zu setzen. Die bekanntesten sind Bloc , Redux und Provider . Eine beliebte Frage ist natürlich, welche dieser Varianten, oder eine hier gar nicht aufgeführte, ist die Beste. Aber darum geht es nicht. Vielmehr um die Tatsache das allen gemeinsam ist, das sie in der einten oder anderen Weise mit Stream's in Dart zu tun haben. Manchmal erkennbar, manchmal gut unter der "Haube" verborgen. Was ist State und was gibt es da zu lösen ? Nehmen wir an, wir hätten 10 Buttons auf dem Schirm. Jeder Button löst, wenn er ged...

  Photo by James Forbes on Unsplash Im letzten Artikel in dieser Serie haben wir den ersten, sehr einfachen Http Server erstellt. Mit der Programmiersprache Dart geht das mit wenigen Zeilen Code. Server Code -- neue Version Den Code vom letzten Artikel ändere ich ab. Wenn Du Ihn Dir noch einmal anschaust, wirst Du feststellen, das er nicht so einfach zu erweitern ist. Die neue Version: Achtung. Achtung. Code nur im Debugg Modus ausführen !! Neu in diesem Code ist, das Du den Server in einer Variable speicherst, und die Auswertung des Request Objekts in einem for(...) Schleifenkörper. Wobei, eigentlich ist es ja keine richtige Auswertung. Der Code registriert das eine Anfrage vom Client kommt und schreibt dann "Hallo Welt" zurück.  In einem ersten Schritt änderst Du den Code zu: Die Verarbeitung des HttpRequest Objekts ist jetzt in eine Funktion ausgelagert. Dir fällt sicher das try..catch(e) Konstrukt auf. Im Code Körper zu try steht der Code, der einen Fehler liefern kön...

  Im letzten Artikel bin ich weiter ins Thema Server / Client eingetaucht. Sicher, es ist ein umfangreiches Gebiet. Aber da es nur darum geht , mir ein Basis Wissen anzueignen, hält es sich doch in Grenzen. Du weißt ja jetzt vom letzten Artikel her, was Du unter Http Protokoll zu verstehen hast. Neben der reinen Datenübermittlung ist ein weiterer Nutzen so eines Protokolls, das es Dir Informationen liefert, ob alles richtig funktioniert hat. Wenn wir einen Server programmieren, müssen wir mit beiden Situationen umgehen. Hier die wichtigsten Status Codes: Http Status Codes Das xx steht im übrigen dafür, das es noch mehr Codes in der jeweiligen Gruppe gibt. Ich nenne hier nur die wichtigsten. Eine umfassendere Liste findest Du hier . 2xx 200 - Erfolg 201 - Created 3xx 301 - Moved Permanently 304 - Not Modified 4xx 400 - Bad Request 401 - Unauthorized 403 - Forbidden 404 - Not Found 5xx 500 Internal Server Error 502 Bad Gateway Wenn wir einen Server programmieren, müssen w...

  In diesem Artikel geht es um die Überprüfung eine Html Formulars , unter Verwendung von Boostrap 5 und Dart . Diese erfolgt in diesem Beispiel auf der Client Seite und ist nur rudimentär. Bootstrap selbst stellt verschieden Klassen zur Verfügung die das unterstützen.  Mit Html kann man auf verschiedene Art und Weise ein Formular erstellen. Die wohl einfachste ist, das offizielle  form Element zu verwenden. Innerhalb dieses Elements können wir die benötigen Elemente einfügen. Das dürften in der Regel input, button, oder option Elemente sein, aber auch zum Beispiel ein Image ist möglich. Der Html Code Achtung: Sie müssen Bootstrap korrekt in ihr Html Dokument eingebunden haben, um das Beispiel nachzuvollziehen.  Der Code erzeugt ein form Element, das mit der Bootstrap 5 Klasse row formatiert ist. Zusätzlich wird auf row noch requires-validation angewandt.  Das ist keine Bootstrap Klasse, sondern eigentlich ein Marker, denn wir dann in Dart benötigen. ...

  In einem älteren Artikel hatte ich bereits das Thema Statefull - / Stateless Widgets angeschnitten. Zur Auffrischung : Flutter kennt zwei Sorten von Widgets (Objekten) . Solche die so angelegt sind, das sie Veränderungen umsetzen können, und solche, die nach der Erstellung in ihrem Zustand verbleiben. Da gerade die Fußball EM läuft ein Vergleich: Das Fußballfeld und die zwei Tore würden Sie über Stateless Widgets realisieren. Es bleibt immer gleich. Die Mannschaften über Statefull Widgets . Die Mannschaften wechseln, die Spieler sind andere. Jedes Mal also, wenn eine neue Mannschaft auf das Spielfeld läuft, muss Ihr Statefull Widget diese Veränderung abbilden. Um den weiteren Artikel gut nachzuvollziehen sollten Sie bereits grundlegende Kenntnisse über Flutter bzw. Dart besitzen. Der Artikel basiert auf einem YouTube Video von Nick Manning (englisch).  State Von Haus aus ist Flutter so eingerichtet, das Sie den Teil des Codes, der eine Veränderu...

Bei diesem Code sind wir im ersten Teil stehen geblieben. Die erste Funktion die hier im main Code aufgerufen wird ist addAufgabe. Bevor wir aber diese Funktion anschauen, ein kurzer Blick auf die Klasse, die dort verwendet wird: Die Klasse enthält drei Variablen . int _id =0;  als private Integer Variabel , int id und String text. Im Konstruktor Aufgabe(...) wird die Zeichenkette gesetzt. Besondere Beachtung verdient :this.id = _id++ ; . Dieser Code erhöht die private Variable int um eins. addAufgabe(...) Diese Funktion wird aufgerufen, wenn eine Eingabe im Inputfeld gemacht und mit der Return Taste abgeschlossen wurde. Dieser Funktion übernimmt das Event als Argument. Dieses stammt von aufgabenInput.onChange.Listen(...) . Da wir das input Html Element im main Code bereits einer Variablen zugewiesen haben, können wir seinen Inhalt (Zeichenkette) einem neuen Objekt vom Typ Aufgabe zuweisen. Dieses Objekt fügen Sie der Liste mit aufgabenListe.add(...) hinzu. Da die Liste jetz...