Flutter Beispiel 3 Row Column Center Text Icon

Hier kommt die aktuelle Version meines Lehrbeispiels für Flutter. Ohne Anspruch auf gute, effiziente Programmierung ging es mir hier nur darum Flutter Widgets im Einsatz zu testen bzw. auszuprobieren. Auch in Flutter gilt, man lernt in dem man es tut und wahrscheinlich, in dem man es falsch tut. Das Ergebnis meines "Ausprobierens" :

Drei Icons, ein wenig Text und die Erkenntnis, das ich das Layout Prinzip von Flutter beginne zu verstehen, aber noch nicht gänzlich durchschaut habe. Prinzipiell kann man sagen, das es wichtig ist, in welcher Reihenfolge Flutter die Elemente auf den Bildschirm zeichnet. Hinzu kommt, das jedes Element oder besser jedes Layout Element eigene Eigenschaften besitzt, die Auswirkungen darauf haben können, wie das Element im Kontext mit anderen Elementen auf dem Bildschirm dargestellt wird. Zu guter letzt..hier der Code. Und hier geht es weiter zum nächsten Beispiel!

Standort: Zürich, Schweiz

Kommentare

Kommentar veröffentlichen

Beliebte Posts aus diesem Blog

Show Dialog in Flutter mit Callback Funktion

Bild
  Vor kurzem hatte ich in diesem Blog einen Post über AlertDialog(...) geschrieben. Photo by 수안 최 on Unsplash In diesem Zusammenhang bin ich dort auf, ShowDialog(...) gestossen. Es ist also keine schlechte Idee diese Funktion näher zu betrachten.  Im Zusammenhang mit AlertDialog(...) haben wir die Frage, was passiert wenn der Button gedrückt wurde, noch damit beantwortet, das der Anwender zurück auf den ursprünglichen Schirm kam.  In einer realen Anwendung wird man aber in der Regel zwei Buttons haben, ok und cancel zum Beispiel. Wir müssen diese zwei Buttons auswerten können. Grundlagen Ein Dialog in Flutter schwebt über allen anderen Bildschirmelementen. Er kann Buttons, aber auch zum Beispiel ein Bild, enthalten. Als Grundeinstellung wird der Hintergrund abgedunkelt. Um effektiv auf die Buttons reagieren zu können, benötigen wir ein Statefull Widget . Ich werde in diesem Post nicht weiter auf dieses Widget eingehen. In diesem Blog, aber auch im Internet, finden sich genug Info
Mehr anzeigen

Flutter -- Tutorial Teil 6 Provider Part 2

Bild
In Part 1 zum Thema Provider haben wir den Code vorbereitet, auf den wir das "Muster" Provider anwenden möchten. Noch einmal zur Erinnerung: Der Code wurde in Visual Studio Code getestet, sollte aber auch in Android Studio problemlos laufen. Der Beispiel Code wurde dem Video von RetroPortalStudio entnommen. Ich empfehle sich das Video anzuschauen, vorausgesetzt man besitzt genügend Englisch Kenntnisse, um dem Audio Kommentar zu folgen. Als erstes werden wir unser Scaffold Widget in ein neues Widget einbetten. Visual Studio Code unterstützt uns dabei mit "Wrap with new Widget" !  Man klickt dazu auf die kleine Glühbirne und wählt im Drop Down Menu den entsprechenden Eintrag aus.  ChangeNotifierProvider(...)  heisst unser neues Widget und ist durch den Import von provider.dart verfügbar geworden: 1 2 3 4 5 import 'package:flutter/material.dart' ; import 'package:provider/provider.dart' ; import 'wetterinfo.dart' ;
Mehr anzeigen

Dart Final Const

Bild
Der Einsatz von  Final und Const in Dart ist nicht ganz einfach zu verstehen. Beide Schlüsselwörter deklarieren eine Variable, die explizit im Code initialisiert werden muss und im weiteren Verlauf nicht mehr veränderbar ist. Wir können zum Beispiel  deklarieren:  int zahl ; . Die Variable zahl ist nicht initialisiert und wird von Dart mit dem Wert  null belegt. Das sollte man nicht mit 0 verwechseln. null lässt sich am besten mit " undefiniert " übersetzen und ist ein Sprachkonstrukt, welches sich innerhalb von Dart auch benutzen bzw abfragen lässt. Im weiteren Verlauf des Programms können wir der Variable zahl werte zuweisen, sprich den Inhalt von zahl ändern. Bei final und const sieht das anders aus. const Beispiel Code: Die erste Variable wird const int tage deklariert. Jeder Versuch sie im weiteren Programmverlauf zu ändern, wird eine Fehlermeldung hervorrufen. Die zweite Variable entsteht aus einer Berechnung, wobei die erste mit einbezogen
Mehr anzeigen