Flutter.

The first version of Flutter was known as "Sky" and worked in the Android operating system. It was presented at the Dart Developer Summit in 2015, with the stated intention of consistently displaying 120 frames per second. ^[7] During a keynote address at the Google Developer Days in Shanghai, Google announced a beta release, Flutter Release Preview 2, which is the last major release before Flutter 1.0. ^[8] On December 4, 2018, Flutter Live released Flutter 1.0, which marks the first stable version of the Framework. ^[9]

The Flutter platform is organized as a series of layers, each of which relies on the previous one.

The Flutter platform consists of the following layers:

• top layers - Dart platform: Material, Cupertino, Widgets, Rendering, Animation, Painting, Gestures, Foundation;
• Flutter engine (C ++): Skia, Dart, Text;
• embedded platform: Render Surface Setup, Native Plugins, Packaging, Thread Setup, Event Loop Interop. ^[ten]

Dart Platform

The upper layers of the frame are used more often than the lower. Libraries are part of the Flutter base platform and are imported using 'package: flutter / <library> .dart' ^[11] .

This platform has a huge number of libraries, widgets (widgets for working with the kernel, animation, UI, widgets that implement the current iOS / Android design language, localizations, and much more). The site https://docs.flutter.io/index.html presents all the libraries available for use. The Foundation library, written in Dart, provides the base classes and functions that are used to construct applications using Flutter, such as APIs for interacting with the engine. ^[12]

Flutter also has a rich community of open source packages. You can view these packages at pub.dartlang.org

The goal of Flutter developers is to help you do more with less code. For example, the “Material” layer is created by compiling the main widgets from the “Widgets” layer, and the “Widgets” layer itself is created by organizing lower-level objects from the “Rendering” layer.

Layers offer many application creation options. Flutter provides freedom of choice: the ability to create pre-built widgets that Flutter provides, or to create your own widgets using the same tools and methods that the Flutter team used to create the infrastructure. When developing applications, you feel the benefits of the productivity of a high-level unified concept of widgets without sacrificing the ability to dive so deeply into the lower levels.

The Flutter engine , written primarily in C ++, provides low-level rendering support using Google's Skia graphics library. In addition, it interacts with a model for a specific SDK platform, such as Android and iOS.

Widgets are the central hierarchy of classes in the Flutter structure. A widget is an invariable description of a part of the user interface. Widgets themselves do not have a mutable state (all their fields must be finite). If you want to associate a mutable state with a widget, consider using StatefulWidget, which creates a State object (via StatefulWidget.createState) whenever it is created and included in the tree. This widget can be included in the tree zero or more times. In particular, this widget can be placed in the tree several times.

Widget({Key key })

The key property controls how one widget replaces another widget in the tree. If the runtimeType and key properties of two widgets have the == operator, respectively, then the new widget replaces the old widget, updating the base element (that is, by calling Element.update with the new widget). Otherwise, the old element is removed from the tree, the new widget is converted to an element, and the new element is inserted into the tree.

The main 3 types of widgets on which the entire application is built:

• StatefulWidget - a stateful widget. A state is information that can be read synchronously when building a widget, and can change over the lifetime of the widget. To notify about a change in the state of a widget, you must specify State.setState. Example:

  class YellowBird extends StatefulWidget {
   const YellowBird ({Key key}): super (key: key);
   @override _YellowBirdState createState () =>
   _YellowBirdState ();
 }

 class _YellowBirdState extends State <YellowBird> {
   @override Widget build (BuildContext context) {
     return Container (color: const Color (0xFFFFE306));
   }
 } 

• StatelessWidget , for widgets that are always built the same way, given the specific configuration and environment. Example:

  class GreenFrog extends StatelessWidget {
   const GreenFrog ({Key key}): super (key: key);
   @override Widget build (BuildContext context) {
     return Container (color: const Color (0xFF2DBD3A));
   }
 } 

• InheritedWidget , for widgets that enter an environment that can be read by child widgets (similar to props in ReactNative). Example:

  class FrogColor extends InheritedWidget {
   const FrogColor ({
     Key key
     @required this.color,
     @required Widget child,
   }): assert (color! = null),
     assert (child! = null),
     super (key: key, child: child);
  
   final color color;
   static FrogColor of (BuildContext context) {
     return context.inheritFromWidgetOfExactType (FrogColor);
   }

   @override bool updateShouldNotify (FrogColor old) => color! = old.color;
 } 

UI is also a code!

For any UI elements there is a widget.

A simple application example:

  import 'package: flutter / material.dart';

 void main () {
   runApp (
     Center (
     child:
       Text ('Hello, world!', TextDirection: TextDirection.ltr,
       ),
     ),
   );
 } 

More information about using these widgets in the official documentation .

A notable feature of the Dart platform is its support for “Hot-reload”, in which changes to the source files can be implemented in a running application. Flutter extends this by supporting stateful hot reboots, where in most cases changes in the source code can be immediately reflected in a running application without requiring a restart or loss of state. ^[13] This feature, implemented in Flutter, has been widely recognized.

• flutter.io - official Flutter website.