-
Notifications
You must be signed in to change notification settings - Fork 2
05. Cheatsheet
Die wichtigste Ressource zur Bearbeitung der Aufgaben ist die Flutter API Referenz Dokumentation. Hier lassen sich alle Bestandteile von Flutter nachschlagen (Widgets, properties, functions, etc.)
In Aufgabe 1 könnt ihr in erster Linie testen, wie man das Styling von UI Elementen mit HTML und CSS auf Flutter übertragen kann. Das Ziel ist es, eine Bildergalerie aus der String Liste _urls im gegebenen GridView zu erstellen, alle anderen Elemente könnt ihr aber beliebig hinzufügen und stylen, wie ihr wollt (z.B. Untertitel hinzufügen, Schriftfarbe ändern, Padding, Hintergrundfarbe etc.).
Ihr könnt die gesamte Aufgabe im itemBuilder lösen. Dieser kann ein Widget zurück geben, welches wiederum das eigentliche Bild als Kind-Widget enthält (z.B. Container). Das Bild kann mit Image.network(_urls[index]) aufgerufen werden.
Wie ihr die bekannten Konzepte aus HTML und CSS in Flutter übertragen könnt, könnt ihr hier nachlesen.
In der zweiten Aufgabe sollt ihr fünf Buttons implementieren. Drei Buttons sollen die drei festen Größen für die Endgeräte darstellen, zwei weitere Buttons sollen ein "+" und "-" für die Konfigurierbarkeit der Größen sein. Wichtig ist hier vor allem, dass ihr den Widget Tree versteht und umsetzen könnt.
Zur Anordnung untereinander ist das Widget Column nützlich, welches eine children Array Property hat.
Zur horizontalen Anordnung mehrerer Buttons dient das Widget ButtonBar, was die Property alignment und ein children Array beinhaltet.
Zur Darstellung von Buttons gibt es verschiedene Möglichkeiten, beispielsweise RaisedButton Widgets oder FlatButton Widgets. Die Buttons können ihrer child Property ein Icon Widget haben, das direkt auf Material Design Icons zugreift (z.B. mit Icon(Icons.icon_name)).
