preface

A while ago, a netizen asked me a question:

In previous software or application development, no matter which design mode, MVC or MVVM, the layout and code logic are usually independent. For example, xAML is used in software development under Microsoft system to write layout, CS code to write logic, and so on.

The birth of such an approach should have been progress at the time. But Google’s new mobile framework, Flutter, is both layout and code logic written together. Is it a step back or a spiral to this stage?

By the way, this user also teased me about the brackets of Flutter.

Let’s talk about flutter here today.

On the future of Flutter

On March 4, Google officially released Flutter 2.0. The biggest feature of the release is that it supports five major operating systems: iOS, Android, Linux, Windows and MacOS. Officials even said Toyota would bring the Flutter to cars.

This means that we can adapt the whole platform with a Flutter code. Everything seems to be going in the right direction.

However, there is a question in many people’s minds: is flutter a retrogression in the way it builds applications? Isn’t Flutter being abandoned?

In fact, people have been asking this question all the time. Here, I will directly quote yu Jia (Zongxin), the client manager of Alibaba Xianyu team:

Cross-platform itself has a great cost appeal for enterprises. Flutter will have a good development in the future when the operating system is likely to become fragmented and multi-terminal. Flutter will become another common technology choice for client development at some stage in its history as the ecosystem becomes more complete.

One of the biggest features of Flutter 2.0, which was officially released by Google earlier this month, is that Flutter can support five major operating systems: iOS, Android, Linux, Windows and MacOS.

That is to say, adapting a whole platform with a Flutter code is no longer far off.

His view is deeply shared by the author.

I see a Flutter

Personally, Flutter is less mentally taxing than Android development.

Implementing everything in the same language and code requires less detail to remember, because everything is a Dart widget class that interacts exactly the same. Writing XML and logic separately, especially when dynamically changing elements, creates a subconscious struggle over where to write them, and various details like constructors need to be kept in mind.

About logical interface separation

BLoC mode is the most complete and straightforward mode of logical interface separation I have seen so far, mainly due to dart support for Stream and a series of built-in flutter controls such as StreamBuilder and FutureBuilder.

The simple logic that should be incorporated into the control itself makes flutter easier to write, directly into the build(context).

For the netizen’s question

This actually feels more dependent on the position of the Flutter.

Look at MVC and MVVM, both of which are based on design patterns proposed at the application or service layer. Because for a Web application, or a client APP, the UI is part of it, but in addition to the UI, there are also business implementations, network requests, data management, etc. How to combine these parts effectively, and at the same time reasonably layer, which is conducive to maintenance and expansion, and avoid conflicts, is the problem to be solved by engineering, so there are MVC, MVP, MVVM and other design patterns.

Look at Flutter. Currently, Flutter is primarily positioned as a UI framework, except that for normal UI frameworks, it can cross ends while maintaining near-native UI performance, but it is essentially the same UI framework. That is to say, its core capability is to make small and large widgets, organize them, and manage their state. To put it another way, Flutter is the V of these MVx modes. From this perspective, it should be easy to understand why Flutter is designed to write layouts directly in code, because they are all at the same level and there is no need to separate them. React will take csS-in-JS into account, and write class HTML tags (JSX) directly in JS should do the same. React positioning is a UI library, with uI-related styles, layouts, and events all written together. If developers aren’t comfortable with the separation or insist on it, they can extend it themselves, resulting in the React module.

Therefore, I believe that the construction of Flutter application is not a retrogression, but a reasonable solution based on positioning. Although it is not necessarily the optimal solution, it is reasonable. No one knows what the optimal solution is, depending on the developer’s own habits, depending on the size of the project, depending on the rules of the corporate team, etc. Flutter can give some of the work to the community, to developers. If the developer feels that the layout of the code is not elegant, extend the capabilities through other modules or plug-ins. The core capability of Flutter is to make and manage widgets. To keep Flutter alive, developers need not only to build widgets, but also “widgets” for it.

Dart code ends up being a bunch of}}}… }, the problem is not so much the language, or the design of the framework itself, but the developer’s ability to organize code and manage code. In my experience, any form of stylized code, any logic implementation, and then method calls, but always a bunch of), or a bunch of}, or deep indentation, means your code needs review and refactor.

The author think

Many developers now have a bias against Flutter. Not many people take the initiative to study because of their interest and hobbies, but I still want to say that he is worth it!

Why Flutter is worthwhile for Android development?

1.Flutter has many advantages

(1) The internationalization program is very friendly

The internationalization solution provided by Flutter officials is very friendly to the internationalization of the layout. Internationalization of the document is also very easy thanks to the Flutter Intl plugin. (Trivial, maybe, but super convenient)

(2) High execution efficiency

In terms of the current market environment, there are two mainstream cross-end solutions:

  • React Native is a framework that uses JavaScriptCore engine as a virtual machine.
  • Using a non-javascriptCore virtual machine, representing the framework that is our hero today, Flutter.

JavaScriptCore, mainly for compatibility with the historical burden left by Web standards, cannot be optimized for mobile devices. Flutter was originally written in the new Dart language and supported both AOT and JIT compilation. Instead of using HTML/CSS/JavaScript, Flutter was significantly more efficient than JavaScriptCore.

(3) Reduce costs and reduce double-end input

This is the main reason why our team decided to Dart First to reduce organizational costs, learning costs and collaborative costs. Consistency of architecture also contributes greatly to r&d effectiveness and quality.

Flutter has many more advantages to discover in practice.

2.Flutter is the market’s choice

There are now many applications using Flutter, based on mobile statistics using libChecker. We can see that Flutter is now being adopted by many large companies:

  • Jingdong’s Jingdong Reading
  • Ali’s idle fish
  • Tencent’s wechat and Now live streaming
  • Bytedance’s watermelon video
  • …

The popularity of a new technology, enterprise-level applications will be generated in the head of Internet enterprises first, and then gradually optimize to lower the threshold. Now that more and more people are using Flutter, it is believed that the tipping point of Flutter explosion is not far away.

Flutter is no longer the niche framework it once was. It has grown into one of the mainstream cross-platform development frameworks.

3. A Flutter is a plus for getting a job

Flutter is currently a plus for Android development positions. Here are some of the job postings I found on Boss.

From the figure above, we can see that Flutter can be a help to us in job hunting because many big factories are recruiting talents with high salaries.

Flutter can also help our career development. Technology is interlinked. When we learn Flutter, we can also connect and connect the original technology. We can use Flutter to amplify our business development capabilities and participate in more platform development.

There is a saying that learning Flutter is equal to learning more than 70% Jetpack Compose for Android native developers.

How can Android developers quickly get started with Flutter?

Once you have a quick setup of the environment and a brief understanding of the Flutter API, there are two main points to learn about Flutter: one is responsive development and the other is understanding what is behind the Widget.

Both of these are difficult for us to develop Android.

To help you learn about Flutter quickly and painlessly, here is a free note on Flutter learning from Git Gao Xing.

Arrange the outline

  • Why is Flutter the ultimate cross-platform development choice
  • Build Flutter development environment on Windows
  • Write your first Flutter App
  • Build and debug the Flutter development environment
  • Basic Grammar for Dart Grammar Part 1
  • Use of the Dart Syntax set and Source Code Parsing (part 2)
  • Dart Set Operator Functions and Source Code Analysis (part 3)
  • Use of functions in Dart Syntax chapter (4)
  • Object-oriented Basics for Dart Syntax (part 5)
  • Object-oriented Inheritance and Mixins in Dart Syntax part 6
  • Dart Syntax: Type System and Generics (part 7)
  • Flutter in the widget

Note: Since there is no standardized and systematic arrangement on the Internet at present, the contents of this study manual are collected and arranged on the Internet according to a framework of the author. This article is open source, only for technical exchanges and sharing, thank you big guyMr PandarightThe Dart grammarPart of the blog to share, thanks to the collation of information partners. You can learn more about flutter by clicking on it!

Click on the【 the 】Enter my official account and add remarks [flutterFor free access to the full version of this information

Information details

Why is Flutter the ultimate cross-platform development choice

  • Why is that?
  • Cross-platform development
  • What is a Flutter
  • The characteristics of Flutter
  • Tools for Flutter building applications
  • Hot app built with Flutter
  • The cost of building the Flutter application
  • …

Build Flutter development environment on Windows

  • Using a mirror
  • System requirements
  • Access to Flutter the SDK
  • Editor Settings
  • The Android Settings
  • Get started: Configure the editor
  • Getting started: Experience
  • Experience thermal overload
  • Creating a new application
  • Run the application
  • …

Chapter 3: Writing your first Flutter App

  • Step 1: Create the Flutter app
  • Step 2: Use external packages
  • Step 3: Add a Stateful Widget
  • Step 4: Create an infinite scrolling ListView
  • Step 5: Add interactions
  • Step 6: Navigate to a new page
  • Step 7: Change the UI using the theme
  • …

Chapter 4 Setup and debugging of Flutter development environment

  • Setup of development environment
  • Installation and debugging of the simulator
  • Setup of development environment
  • Installation and debugging of the simulator
  • …

Chapter 5 basic Grammar for Dart

  • Hello Dart
  • The data type
  • Variables and constants
  • Set (List, Set, Map)
  • Process control
  • The operator
  • abnormal
  • function
  • …

Chapter 6: Use of the Dart Syntax set and Source Code Parsing (II)

  • List
  • Set
  • Map
  • Queue
  • LinkedList
  • HashMap
  • Map, HashMap, LinkedHashMap, and SplayTreeMap
  • Naming the difference between the constructors from and of and suggestions for using them
  • …

Chapter 7 collection Operator Functions and Source Code Analysis for Dart Syntax

  • Iterable (Iterable class diagram, Iterable class method diagram…)
  • ForEach (Introduction, usage, source code analysis……)
  • Map (Introduction, usage, source code analysis……)
  • Any (Introduction, usage, source code parsing…)
  • Every (introduction, usage, source code analysis……)
  • Where (introduction, usage, source code analysis……)
  • FirstWhere and singleWhere and lastWhere
  • Join (Introduction, usage, source code analysis……)
  • Take (Introduction, usage, source code analysis……)
  • TakeWhile (Introduction, usage, source code analysis……)
  • … (Too much content)

Chapter 8 use of Functions in Dart Syntax (IV)

  • Function parameters
  • Anonymous functions (closures, lambda)
  • Arrow function
  • Local function
  • Top-level functions and static functions
  • The main function
  • …

Chapter 9: Object-oriented Basics for Dart Syntax (5)

  • Property accessor function setters and getters
  • Variables in object orientation
  • The constructor
  • Abstract methods, abstract classes, and interfaces
  • The class function
  • …

Chapter 10 object-oriented Inheritance and Mixins in Dart Syntax (6)

  • Class single inheritance
  • Multiple inheritance based on Mixins
  • …

Dart Syntax: Type System and Generics (7)

  • Optional type
  • The interface type
  • The generic
  • Type externalization
  • …

Chapter 12 Widgets in Flutter

  • The Flutter page – Basic Widget
  • Widget
  • StatelessWidget
  • Stateful Widget
  • State lifecycle
  • Based on the widget
  • Text display
  • …

Click on the【 the 】Enter my official account and add remarks [flutterFor free access to the full version of this information

The last

I hope this information can be helpful and a reference direction for those who want to learn about Flutter and get started quickly.

A journey of a thousand miles begins with a single step. May you and I encourage each other.