What are the advantages of the completely free and open source flutter? How to learn about flutter?

What is? Flutter？

Flutter yes Google The new generation of front-end framework launched by the company , The initial goal is to meet the cross platform application development of the mobile terminal , Developers can use Flutter stay iOS and Android Quickly build high-quality native user interfaces on . But now ,Flutter already Start to expand to face the mobile end at the same time 、Web、 Desktop and embedded device development and application .Flutter Is being more and more Used by developers and organizations , It is also the foundation for building the future Google Fuchsia The main way of application , And it's completely free 、 Open source .

Flutter The advantages of ：

1、 Open source , It is also due to open source , So with the crazy support of global developers , In recent years flutter Rapid development , More and more perfect , I believe we can windows,mac,linux And other platforms can also shine . Truly achieve a set of code multi terminal deployment . 2、 Stable ,Flutter UI Due to self drawing UI, Thus avoiding the platform level UI And various compatibility problems caused by system upgrade . However, as a cross platform development technology, it is inevitable to maintain the underlying adaptation layer and various plug-ins to realize the communication with the original platform , This is a common problem of all cross platforms . 3、 Efficient , For developers , Use Flutter Development and application are very efficient .Flutter Well received Hot Reload Functions can be found in 1 Seconds to UI Update , The development operation cycle is greatly shortened .

Flutter Unique features ：

• Focus on customizable widgets , have access to Material Design and Cupertino package （ instead of android XML） It's easy to develop UI.
• Hot overloads help developers see their changes immediately . This reduces development time and bug fix time . Write once , Any code that can run on any platform , Run without change .
• Flutter Use Dart programing language , The language can be used in advance , You can also compile in time , Thus providing high performance and faster start-up time .
• Native ARM The machine code can be found in Android and iOS Implementation of native performance on .

install Flutter

The first thing you should do is get SDK – Software development kit – It's a set of software tools , These tools are packaged in one package , And can be used in your development environment . For development , We use the integrated development environment （IDE）– Make your development and testing easy and fast . As we learned before , Yes 2 It's a popular IDE – VS Code – It's light , Fast , Do you want IDE It has all the functions it has ！ Android Studio – Use... On the device Android Studio, You just need to install Flutter and Dart Plug in for , Set up SDK, That's all right. . It's easy to set up , You can follow Official documents Operate as described in .

Use Flutter Build a simple application Let's build a simple Hello World Program . Through this program , We will understand Flutter The structure of the system and the main methods used . Simple though it is , But it's still a good start . To create a new Flutter project , Just type in ：

$ flutter create flutter_app

Flutter The new project mainly includes the following contents ：

flutter_app

android – Generate Android application . Anything about Android The implementation of will be put in this folder . assets – For storing data files , Image, etc …

ios - Generated iOS application . Anything about iOS The implementation of will be put in this folder .

lib- The main code files are created here ,main.dart - Master file

test– For unit testing

For our relatively simple App, We just need “ main.dart”. file . The file comes with some code , Developers usually delete it to write code from scratch . That's what we're going to do ！ The first important thing is to import “ material ” package . It is used to introduce UI Components .

import 'package:flutter/material.dart';

Like many other languages , Execution from main Method start .main The method should include runApp() Method , This method calls the code to be executed .

void main() => runApp(new HelloWorldApp());

The code to execute is just a widget . please remember ,Flutter Is completely based on widget( The widget ) Of .

that , What is? widget( The widget )？

If you don't know , that widget( The widget ) It can be anything in the view - button( Button ),list( list ),table( form ),input box( Input box ),card view( Card view ), wait . therefore , Your whole Flutter Applications are a collection of widgets , These widgets are nested together , To build a beautiful UI . That's why every class you create should extend the widget class .

Because our application only needs to print Hello World, So we just need a widget that doesn't need to save any state -StatelessWidget( Stateless widget ).StatelessWidget( Stateless widget ) It has a construction method .

class HelloWorldApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
Now comes the main magic –
    return new MaterialApp(
      home: new Material(
        child: new Center(
          child: new Text("Hello world!"),

MaterialApp It's the encapsulation of the widget ,Material yes materials One of the ,Center It's a widget that centers elements .Text Text field widget will be added . Except for the properties you see （home,child） Outside , There are many other attributes （ for example style( style ),position( Location ), decoration( decorate ), wait ） It can perfect the whole UI.

then , Now let's put all the code together

import 'package:flutter/material.dart';
void main() => runApp(new HelloWorldApp());

class  extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Material(
        child: new Center(
          child: new Text("Hello world!"),
        ),),);}} 

… And use the command to run it

$ flutter run