A beautiful design and useful project for Building a flutter knowledge architecture

  Flutter App, UI

flutter_dojo

Dojo, from Japanese “Dojo”.

The main purpose of the flutter_dojo project is to help Flutter beginners quickly get started with Flutter development, and use this project to quickly establish Flutter’s knowledge architecture.

flutter_dojo is mainly divided into the following parts: Widgets, UI Pattern, Develop UI Kit, Animations, Back-end Util.

Experience Apk Download:

flutter_dojo

Design ideas

The design of flutter_dojo is mainly based on the following three parts:

  • Good presentation effect
  • Simple and clear code
  • Nice interface design

The code of the entire project is based on the above points. The code is intended to be concise and does not use complex architectural design and abstraction. The demo code of each part can be used almost alone while beautifying the UI as much as possible.

Widgets

The design idea of ​​the Widgets part is to demonstrate the specific usage scenarios and functions of a large number of Widgets in Flutter. Although only some basic Widgets provided by Flutter can be used to achieve most of the interface and function development, to learn more about Widgets, It allows developers to broaden their development ideas and use more suitable Widgets to complete suitable development scenarios.

UI Pattern

The design idea of ​​the UI Pattern part is to help developers understand how to use Flutter to split the interface templates in most apps, and implement individual UI components through Flutter to form a complete Flutter interface.

Develop UI Kit

The design idea of ​​the Develop UI Kit part is to help developers master the use of some commonly used tools in Flutter, let developers understand the layout, measurement and common UI tools of Flutter, and lay a good foundation for better use of Flutter components.

Animations

The design idea of ​​the Animations part is to allow developers to have a complete understanding of Flutter’s animation, use different animation solutions for different scenes, and at the same time, sort out the most common animation scenes to complete the classification of animation scenes.

Back-end Util

Back-end Util is mainly for combing knowledge of non-UI scenes in Flutter, including data persistence, analysis, state management, and so on.

Display interface

All the display interfaces are for the purpose of demonstration effects, show the main attributes of the widget, and demonstrate the effect of changing the attributes through examples, as follows.

After modifying the corresponding attribute, you can directly display the modification effect, so that you can understand the role of the attribute.

At the same time, the Demo code can be viewed directly.

And the code can also be shared directly, and the shared code is almost the code that can be directly copied.

Widgets

The Widgets section contains almost all of the widgets in the official Flutter Category. Yes, you read that correctly. According to the Category of the official website, all the widgets listed in the official list are exhausted. At the same time, some new widgets that do not appear in the Category, but have Very common widget.

In each Category, widgets are displayed in the order of AZ.

UI Pattern

The UI Pattern section contains commonly used interface development template elements in the APP, such as APPBar, Banner, Login, Setting, etc. In the UI Pattern, developers can find the UI elements they decompose and learn how to use Flutter to build these UI components.

In UI Pattern, I have listed many different template types.

Develop UI Kit

The Develop UI Kit lists some common tool classes and development template code in UI development. Developers can use these tool classes to complete some UI function development.

In the Develop UI Kit, the related code is arranged according to AZ.

Animations

Due to the importance of animation in APP development, Animations are specifically listed here as a separate item. Developers can find different Animation development modes here, and understand different methods of using Animation.

In Animations, it is also divided according to different functions.

Back-end Util

Back-end Util lists some Flutter knowledge points that are not UI.

Flutter is not just a UI cross-platform framework, it is also a complete APP development framework, so here are some functions other than UI development.

cooperation

Although the project has basically taken shape, a lot of content needs to be further improved, especially the inductive part, there are still many areas that are still incomplete, and even some code has not yet been implemented, which needs further optimization and implementation.

Therefore, everyone is welcome to submit a PR, and we hope that everyone will submit according to the template code to improve this project together.

Download Source Code on GitHub

https://github.com/xuyisheng/flutter_dojo