Was ist eigentlich Flutter?

Markus Kühle
coodoo
Published in
3 min readJul 5, 2019

--

Flutter ist ein von Google entwickeltes UI Framework, mit dem native Apps für Mobile, Web und Desktop mit einer einzigen Codebase in sehr kurzer Zeit entwickelt werden können. Die darunter liegende Programmiersprache ist Dart.

Zum ersten Mal vorgestellt wurde das Framework bereits 2015 auf dem Dart Developer Summit. Doch erst mit dem Release der 1.0 Version im Dezember 2018 kam eine stabile Version in Umlauf, die sich seither einer immer größeren Beliebtheit erfreut.

Architektur von Flutter

Die Architektur von Flutter besteht aus zwei Teilen: die Flutter Engine und das Flutter Framework.

Flutter Engine

Die Flutter Engine ist eine portable Laufzeitumgebung zum Hosten von Flutter Anwendungen in einer plattformabhängigen Shell (z.B. Android oder iOS).

In der Engine befinden sich alle core Technologien wie z.B. die Skia 2D Rendering Engine (https://skia.org), welche auch von Google entwickelt wird und z.B. im Chrome oder Firefox Anwendung findet. Außerdem die Dart Runtime, die unter anderem Garbage Collection übernimmt oder in der Entwicklung ein extrem schnelles Hot Reload bereitstellt.

Framework

Die meisten Entwickler werden bei der App-Entwicklung nur mit dem Framework arbeiten. Das Framework stellt alles bereit, was für die Entwicklung von User Interfaces benötigt wird. Das beginnt bei den Components Widgets für die UI Komponenten über Animationen bis zu den Framework Foundations.

Flutter UI Design

Flutter Design I

Alles ist ein Widget. Das User Interface Design funktioniert bei Flutter primär über das Erstellen oder Zusammenbauen von Widgets. Widgets sind in Flutter unveränderliche Beschreibungen von Elementen in der Benutzeroberfläche. Hierzu gehören alle Grafiken, einschließlich Texte, Formen und Animationen. Komplexere Widgets können durch Kombinieren einfacherer Widgets erstellt werden.

Quelle flutter.dev

Flutter Design II

Zusätzlich enthält das Flutter-Framework zwei Widget-Bibliotheken, die bestimmten Designsprachen entsprechen. Material Design-Widgets implementieren Googles gleichnamige Designsprache und Cupertino-Widgets imitieren das iOS-Design von Apple. Dies macht das Entwickeln von Apps in Flutter noch einfacher und es entstehen so auch ohne viel Aufwand sehr gut aussehende User Interfaces.

Material Components widgets: https://flutter.dev/docs/development/ui/widgets/material

Cupertino (iOS-style) widgets: https://flutter.dev/docs/development/ui/widgets/cupertino

Flutter Design III

Widgets sind für die Erstellung von Flutter Apps jedoch nicht zwingend notwendig. Man kann die Foundation Library auch direkt verwenden und so mit Hilfe von ‘canvas’ Befehlen Formen, Texte und Bilder direkt auf den Bildschirm malen. Diese Flutter Eigenschaft wird von einigen anderen Frameworks genutzt, so zum Beispiel der Flame Game Engine (https://github.com/flame-engine/flame). So ist z.B. das Entwickeln von Spielen auf dem Smartphone möglich.

Flutter.de

Für mich ist Flutter ein spannendes Framework für das schnelle und unkomplizierte Entwickeln nativer Anwendungen mit extrem viel Potential. Deswegen haben wir von coodoo es uns zur Aufgabe gemacht, Flutter maximal in Deutschland zu unterstützen und über die Flutter-Community aufstrebende Flutteraner zu unterstützen und zusammenzubringen.

Mehr Infos findest du auch auf flutter.de.

Flutter Meetup Rhein-Main

Ich habe das Flutter Framework auch bei dem ersten Flutter Meetup Rhein-Main präsentiert. Hier die dazugehörigen Folien zum durchklicken:

Viel Spaß mit Flutter :)

Update: 06.09.2019: Flutter Meetup Folien ergänzt

--

--