FAIR一键接入
2022年10月12日大约 1 分钟
Flutter Fair接入
添加依赖
推荐使用pub形式引入
# add Fair dependency
dependencies:
fair: 3.0.0
# add build_runner and compiler dependency
dev_dependencies:
build_runner: ^2.0.0
fair_compiler: ^1.4.0
# switch "fair_version" according to the local Flutter SDK version
# Flutter SDK 3.3.x(3.3.0、3.3.1、3.3.2、3.3.3、3.3.4、3.3.5、3.3.6) -> flutter_3_3_0
# Flutter SDK 3.0.x(3.0.0、3.0.1、3.0.2、3.0.3、3.0.4、3.0.5) -> flutter_3_0_0
# Flutter SDK 2.10.x(2.10.0、2.10.1、2.10.2、2.10.3) -> flutter_2_10_0
# Flutter SDK 2.8.x(2.8.0、2.8.1) -> flutter_2_8_0
# Flutter SDK 2.5.x(2.5.0、2.5.1、2.5.2、2.5.3) -> flutter_2_5_0
# Flutter SDK 2.0.6 -> flutter_2_0_6
# Flutter SDK 1.22.6 -> flutter_1_22_6
dependency_overrides:
fair_version: 3.3.0
目前Fair支持Flutter 3.3.x及以下的绝大多数版本,如遇任何问题,可通过社群和ISSUE与我们联系
Flutter版本切换
通过切换 flutter_version 版本进行版本兼容。例如,将本机切换为 flutter 2.0.6 后,Fair 需要同步切换
# switch to another stable flutter version
dependency_overrides:
fair_version: 2.0.6
使用 Fair
在App中接入Fair步骤如下:
将 FairApp 添加为需要动态化部分的顶级节点
常见做法是作为 App 的根节点,如果不是全局采用也可以作为子页面的根节点
void main() {
WidgetsFlutterBinding.ensureInitialized();
FairApp.runApplication(
_getApp(),
plugins: {
},
);
}
dynamic _getApp() => FairApp(
modules: {
},
delegate: {
},
child: MaterialApp(
home: FairWidget(
name: 'DynamicWidget',
path: 'assets/bundle/lib_src_page_dynamic_widget.fair.json',
data: {"fairProps": json.encode({})}),
),
);
添加动态组件
每一个动态组件由一个FairWidget
表示。
FairWidget(
name: 'DynamicWidget',
path: 'assets/bundle/lib_src_page_dynamic_widget.fair.json',
data: {"fairProps": json.encode({})}),
根据不同场景诉求,FairWidget可以混合和使用
- 可以作为不同组件混合使用
- 一般作为一个全屏页面
- 支持嵌套使用,即可以局部嵌套在普通Widget下,也可以嵌套在另一个FairWidget下
相关示例详情,请查看 example 代码