Flutter 2021 - erste Schritte mit Android Studio

Erste Schritte
 Im letzten Post hast Du gesehen, wie einfach es ist ein Flutter Projekt in Android Studio anzulegen. Das Projekt selbst ist sogenannter Boiler Code.

Neben der Ordner Struktur, gibt Dir dieser Boiler Code ein kleines Programm an die Hand und ermöglicht so erste Schritte.

Dieses kleine Programm ist schon selbständig ausführbar und enthält bereits wichtige Merkmale von Flutter.
Ein Programm in Android Studio ausführen, heisst es im Android Emulator laufen zu lassen. Immer vorausgesetzt Android Studio meldet Dir keine Fehler im Code. Da der Boiler Code ja von Android Studio vorgegeben wurde, ist er erwartungsgemäß auch fehlerfrei. Falls Du das Flutter Projekt vom letzten Post noch nicht offen hast, dann wäre es jetzt Zeit dafür.

Boiler Code

Dein Bildschirm sollte eigentlich so aussehen:

ein Teil des Boiler Codes

Dabei ist das Bild oben nur ein Ausschnitt des gesamten Codes. Bevor Du diesen Code nun ausführen kannst, musst Du ein AVD, ein Android Virtual Device, starten. In Android Studio kannst Du verschiedene AVD's einrichten. Unter Tools/AVD Manager ruft man diesen auf:

AVD Auswahlschirm

Im Bild oben befindet sich unten links der Button (Create Virtual Device) um ein neues AVD zu erstellen. Die bereits installierten Emulatoren siehst Du aufgelistet. Mit einem Klick auf das grüne Dreieck, wird ein ausgewähltes AVD gestartet. 

Du kannst mit Flutter bekanntlich ja Apps für das Mobilephone entwickeln. Aber der Markt für Mobilephones ist gross. Obwohl die Betriebssysteme Android und iOS dominieren, unterscheiden sich die einzelnen Geräte zum Teil deutlich. Das betrifft vor allem die Bildschirmgrösse, die verwendete Betriebssystem Version etc.
Sollte also Dein gewünschtes Phone nicht in der Liste erscheinen, klickst Du den Button Create Virtual Device und gelangst zum folgenden Schirm:


Falls man das gewünschte Mobile in der Liste findet, wählt man es an und klickt auf Next. Aber Achtung: Es ist durchaus möglich, das ein spezifisches Model nicht in der Liste auftaucht. In Android Studio kann man zusätzliche Modelle auch importieren, aber darauf einzugehen würde den Rahmen dieses Posts sprengen.
Es folgen hier noch weitere Schritte, um das Einrichten eines AVD's abzuschließen. Diese sind selbsterklärend, können aber eventuell zusätzliche Downloads benötigen.

Aber halt, Android Studio macht es Dir einfach. Im Normalfall sind schon AVD's vorinstalliert. Du findest Sie hier:

AVD Auswahl in der Toolbar

Bei no device selected kannst Du ein Drop Down Menu verwenden und einen Emulator auswählen. Ich habe hier das Pixel 3a gewählt:

Emulator Pixel 3a
Natürlich könntest Du auch ein echtes Gerät verwenden, indem Du dieses mit dem PC verbindest und in die Entwicklungsumgebung einbindest.

Für die ersten Schritte mit Dart und Flutter reicht der Emulator aber vollkommen aus.

Im nächsten Post werden wir uns die Ordner Struktur des Boiler Projekts genauer ansehen. Bis bald !



 



Standort: Zürich, Schweiz

Kommentare

Kommentar veröffentlichen

Beliebte Posts aus diesem Blog

Material Design in Flutter Teil 2

Bild
Im ersten Teil des Posts zu diesem Thema, haben wir ein kleines Programm geschrieben, das einige "Material Design Elemente" von Flutter auf den Bildschirm (Emulator) bringt. Im zweiten Teil des Posts gehen wir nun ein wenig mehr auf die Möglichkeiten ein, die Material Design bietet. Farben Wer in seinem Flutter Projekt Farben direkt definieren will, kann diese als ARGB werte festlegen. Hier ein Beispiel: 0xff42f4dc Die obige Zeichenkette beginnt mit 0x und definiert, das die Zeichenkette als Hexadezimal Wert zu verstehen ist. ff , ist der Wert für den Alpha Kanal der Farbe. Dieser legt die Transparenz der Farbe fest. In diesem Beispiel ist der Wert 255 , was nichts anderes heißt, als das die Farbe zu 100% sichtbar ist. Geringere Werte lassen die Hintergrundfarbe durchscheinen bzw mischen "unsere" Farbe mit der Hintergrundfarbe. 42 legt den Rotanteil fest, f4 den Grünanteil, dc , den Blauanteil fest. Kompakt: 0x = es handelt sich um eine Hex
Mehr anzeigen

Flutter -- ohne Dart geht es nicht 2 -- einfache Variablen Typen

Wer sich noch einmal den ersten Teil durchlesen möchte, geht auf diese Seite . Ohne Variablen kann man nicht programmieren. Dar t stellt uns eine Reihe von Variablen Typen zur Verfügung, wobei man immer im Hinterkopf behalten sollte: Alle Variablen Typen in Dart sind auch Objekte! Alle Variablen haben den Startwert NULL .  Beispiel: int jahr = 2018 ;   // int = Variablen Typ für ganze Zahlen z.b.: 1 oder 39 oder 5315 Der Variable mit dem Namen jahr weisen wir den Wert 2018 zu. Wir hätten für die Variable jahr , auch folgende Deklaration verwenden können: var jahr = 2018 ; In dieser Variante wird Dart jahr ebenfalls als int Variable behandeln. Der große Unterschied ist jedoch, das wenn wir im späteren Programmverlauf, dieser Variable ohne Fehlermeldung z.b. einen String zu weisen können. Während dies bei der int Version zu einer Fehlermeldung führen würde . Einer int Variablen können wir aber auch einen hex Wert zuweisen: int seltsame Zahl = 0xEADEBAEE
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