Flutter learning - opening

Disclaimer: I Flutter study are based on Flutter official website and Flutter Chinese net , it will introduce some resources and code them.
"Flutter real"

Flutter

Flutter is quit and open source Google mobile UI development SDK, working with a unified code base for the shift applications (Android & iOS), Web and desktop applications.

Flutter use Skia as its 2D rendering engine, cross-platform rendering engine, making Flutter can render the same performance on different platforms. However, the current iOS system using Metal rendering engine, so we have to go in the Skia packaged together in iOS application package.

Flutter developed using the Dart language. Dart advantage while supporting in its JIT (Just in time) and AOT (Ahead of time) two operation modes, which allows developers to use JIT mode (dynamic interpretation) development, real-time translation to see the effect after code changes, using AOT mode (ahead of compilation) published application package. This not only improves the efficiency of development, without affecting the performance of the application.

Flutter architecture

The following is a "Flutter real" architecture diagram:

framework.png

From bottom to top:

• Foundation layer (Animation, Painting, Gestures) layer corresponds to the Flutter dart: ui package that provides basic capabilities of the UI, including animation, and drawing ability gesture.
• Rendering layer, similar to the concept of virtual DOM, responsible for building the UI tree, calculate and plot layout and response update.
• Widgets layer based UI components
• Meterial and Cupertino are two different styles of UI component library.

Flutter Engine

Flutter Engine is implemented in C ++ SDK, which includes Skia engine, Dart runs, text layout engines. In the code calls dart: When ui library, call eventually went Engine layer and draw logical true.

After understanding the basics, the next step is to build a development environment. Flutter official website installation documentation to build Flutter development environment for different systems to do a detailed explanation, please refer to the examiner nets to build.