Flutter Fair: A new package used to update widget tree dynamically

Image for post
Image for post
Flutter Fair

Why create Flutter Fair?

Prototype exploration

Image for post
Image for post
ListView demo preview
{
"className": "ListView.builder",
"na": {
"itemBuilder": "#(bizColorLabelBuilder)",
"itemCount": 50
}
}
ListView.builder(
itemBuilder: bizColorLabelBuilder,
itemCount: 50,
);

Fair — Flutter over the air

IO direction
IO direction
Input to Output
Image for post
Image for post
modules of Fair
Image for post
Image for post
FairApp Widget
FairWidget(
path: 'assets/bundle/lib_page_dynamic_widget.fair.bin',
data: {'content': 'Red Box'},
)
Image for post
Image for post
Red box sample

Fair architecture

Image for post
Image for post
Fair Architecture
# Switch to another stable flutter version
dependency_overrides:
fair_version:
git:
url: https://github.com/wuba/fair.git
ref: master
path: fair_version/flutter_1_12_13
Image for post
Image for post
Custom Widget
Image for post
Image for post
Generated mapping code
Image for post
Image for post

DSL & AST

Image for post
Image for post
Image for post
Image for post

Next

https://github.com/wuba/fair.

Android & Flutter developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store