Flutter Widgets - Column II

Im ersten Post zu diesem Thema haben wir ein ganz einfaches Beispiel genommen. Hier ein weiteres:

Quellcode: Column zentriert
Dieser Beispielcode, wenn in Android Studio ausgeführt, ergibt bei der Ausführung folgendes Bild:
Android Studio AVD Ausgabe
Die Zentrierung erreicht man, indem das Column Widget als "Child" eines Center Widgets implementiert ist. In diesem Fall wurden die drei Text-Widgets vom ersten Beispiel, mit Container-Widgets ersetzt. Damit lassen sich jetzt einige Dinge testen. Mehr in Kürze !
Standort: Zürich, Schweiz

Kommentare

Kommentar veröffentlichen

Beliebte Posts aus diesem Blog

Dart für Anfänger Teil 1.3 Variablen vertieft

Bild
  Bisher: Nach einem langsamen Einstieg ins Thema Programmieren mit Dart, haben wir im zweiten Teil unsere erste Problemstellung gelöst. Die Addition von drei Zahlen mit einem Dart Programm. Gleichzeitig haben wir das Thema Variablen angeschnitten, ein Kernelement der Programmierung. In diesem Artikel vertiefen wir das Thema. Die Welt der Variablen Man muss vorausschicken, das Dart eine objektorientierte Programmiersprache ist. Wer sich mit dem Thema noch nicht beschäftigt hat, muss hier nicht zurückschrecken. Am Anfang ist nur wichtig: die Datentypen die wir durch die Verwendung der entsprechenden Schlüsselwörter verwenden, bieten noch weitere Möglichkeiten . Aber zurück zu den Anfängen. Hier ein Beispiel Code: 1 2 3 4 5 void main() { int hase; print(hase); } Im Beispiel oben wurde der Integer Variable hase kein Wert zugewiesen. Das DartPad wird aber diesen Code ohne Fehlermeldung ausführen. Hm, wieso ? Wenn eine Variable nicht initialisiert wird, d.h. ihr wird kein...
Mehr anzeigen

Flutter -- Tutorial Teil 2 State und Co

Bild
Im ersten Teil dieses Tutorials sind wir schon auf ein paar Begriffe gestoßen, die für Flutter wichtig sind. Da wären Widgets, MaterialApp, und was mit extends , also eine Klasse erweitern, gemeint ist. Wir sollten uns noch einmal in Erinnerung rufen, das wir eine moderne Anwendung grob unterteilen können. Code der die Benutzeroberfläche erstellt und verwaltet und Code, der den Nutzwert des Programmes umsetzt. Eine Taschenrechner App braucht ebenso eine Benutzeroberfläche, wie eine Wetter App . Der Teil des Codes der den Nutzwert der App ermöglicht, dürfte aber sehr unterschiedlich sein. Taschenrechner und Wetter App benötigen wahrscheinlich Buttons, eventuell Bilder und ganz sicher Text. Das heisst vieles was man in Richtung Benutzeroberfläche programmiert, ist eventuell nicht nur in einem Projekt brauchbar. Sondern könnte, mit Anpassungen, in einem anderen wiederverwendet werden. Diese Erkenntnis führt zu dem Versuch den Code des Userinterfaces , von dem Code für die Busines...
Mehr anzeigen

Flutter: ein eigenes Widget erstellen und einbinden

Bild
Wenn man sich mit Flutter beschäftigt, stößt man früher oder später an Grenzen. Dabei meine ich jetzt nicht eine spezifische Problemstellung, sondern vielmehr die Strukturierung und die Organisation des eigenen Codes. Das mag einem geübten, professionellen Programmierer nur ein müdes Lächeln entlocken. Menschen die programmieren lernen, ob jetzt aus beruflichen Gründen, oder aus Spaß an der Sache, eher weniger. In diesem Post schauen wir uns deshalb, die Möglichkeit an ein Custom Widget zu verwenden. Starter Code  Über die letzten Artikel habe ich den Starter Code eigentlich nicht mehr verändert. Er dient als Anker für die Demo Widgets die ich erstelle, um Flutter zu testen: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 import 'package:flutter/material.dart' ; import 'package:flutter/rendering.dart' ; import 'package:tutflutter_002/meine_widgets.dart' ; void main() { debugPaintSizeEnabled = false; runApp(MeinDemo()); }...
Mehr anzeigen