Comments (2)
1.common_utils
插件无法转换的原因
@FairBinding
是用来为 布局 生成组件映射关系的,而 common_utils
这个库本身不是 UI 相关的库,只是一个工具库,common_utils.dart
文件里写的也不是布局相关的代码,而是对外暴露的 API:
library common_utils;
export 'src/date_util.dart';
export 'src/encrypt_util.dart';
export 'src/json_util.dart';
export 'src/log_util.dart';
export 'src/money_util.dart';
export 'src/num_util.dart';
export 'src/object_util.dart';
export 'src/regex_util.dart';
export 'src/text_util.dart';
export 'src/timeline_util.dart';
export 'src/timer_util.dart';
2.cached_network_image
插件无法转换的原因
查看 cached_network_image
库的源码我们发现,他的主要实现代码放在了 src
的目录下,在 cached_network_image.dart
里面并不是布局相关代码,而是对外暴露的 API,因此通过下面的方式无法生成组件映射关系:
@FairBinding(packages: ['package:cached_network_image/cached_network_image.dart'])
正确的引用方式为:
@FairBinding(packages: ['package:cached_network_image/src/cached_image_widget.dart'])
我们会在后续的版本中,考虑兼容这种情况。
我们以 cached_network_image: ^2.5.0
这个版本为例:
运行结果:
// Generated by Fair on 2021-05-31 16:09:54.002728.
import 'package:cached_network_image/src/cached_image_widget.dart';
import 'package:flutter/material.dart';
import 'package:fair/fair.dart';
import 'package:fair_version/fair_version.dart';
class AppGeneratedModule extends GeneratedModule {
@override
Map<String, dynamic> components() {
return {
'CachedNetworkImage': (props) => CachedNetworkImage(
key: props['key'],
imageUrl: props['imageUrl'],
httpHeaders: props['httpHeaders'],
imageBuilder: props['imageBuilder'],
placeholder: props['placeholder'],
progressIndicatorBuilder: props['progressIndicatorBuilder'],
errorWidget: props['errorWidget'],
fadeOutDuration:
props['fadeOutDuration'] ?? const Duration(milliseconds: 1000),
fadeOutCurve: props['fadeOutCurve'] ?? Curves.easeOut,
fadeInDuration:
props['fadeInDuration'] ?? const Duration(milliseconds: 500),
fadeInCurve: props['fadeInCurve'] ?? Curves.easeIn,
width: props['width']?.toDouble(),
height: props['height']?.toDouble(),
fit: props['fit'],
alignment: props['alignment'] ?? Alignment.center,
repeat: props['repeat'] ?? ImageRepeat.noRepeat,
matchTextDirection: props['matchTextDirection'] ?? false,
cacheManager: props['cacheManager'],
useOldImageOnUrlChange: props['useOldImageOnUrlChange'] ?? false,
color: props['color'],
filterQuality: props['filterQuality'] ?? FilterQuality.low,
colorBlendMode: props['colorBlendMode'],
placeholderFadeInDuration: props['placeholderFadeInDuration'],
memCacheWidth: props['memCacheWidth'],
memCacheHeight: props['memCacheHeight'],
cacheKey: props['cacheKey'],
maxWidthDiskCache: props['maxWidthDiskCache'],
maxHeightDiskCache: props['maxHeightDiskCache'],
imageRenderMethodForWeb: props['imageRenderMethodForWeb'],
),
};
}
@override
Map<String, bool> mapping() {
return const {
'CachedNetworkImage': true,
'Test': true,
};
}
}
demo 效果:
3.extended_text
插件无法转换的原因
原因和 cached_network_image
类似,他们的实现代码都是在 src 目录下,extended_text.dart
里面也是写的对外暴露的 API,而不是具体的布局代码。
想要为某个组件生成映射关系,必须去 src
目录下找到对应得 dart
文件。
以 extended_text: ^6.0.0
这个版本为例,我们想为 ExtendedRichText
生成映射关系,它的路径在 src/extended_rich_text.dart
,那么使用 FairBinding 时,需要把这个路径代上:
@FairBinding(packages: ['package:extended_text/src/extended_rich_text.dart'])
运行结果:
'ExtendedRichText': (props) => ExtendedRichText(
key: props['key'],
text: props['text'],
textAlign: props['textAlign'] ?? TextAlign.start,
textDirection: props['textDirection'],
softWrap: props['softWrap'] ?? true,
overflow: props['overflow'] ?? TextOverflow.clip,
textScaleFactor: props['textScaleFactor']?.toDouble() ?? 1.0,
maxLines: props['maxLines'],
locale: props['locale'],
onSelectionChanged: props['onSelectionChanged'],
strutStyle: props['strutStyle'],
textWidthBasis: props['textWidthBasis'] ?? TextWidthBasis.parent,
selection: props['selection'],
selectionColor: props['selectionColor'],
startHandleLayerLink: props['startHandleLayerLink'],
endHandleLayerLink: props['endHandleLayerLink'],
textHeightBehavior: props['textHeightBehavior'],
selectionHeightStyle:
props['selectionHeightStyle'] ?? BoxHeightStyle.tight,
selectionWidthStyle:
props['selectionWidthStyle'] ?? BoxWidthStyle.tight,
overflowWidget: props['overflowWidget'],
textSelectionDelegate: props['textSelectionDelegate'],
hasFocus: props['hasFocus'],
),
备注一下我的运行环境:
Flutter SDK:1.22.6
Dart SDK:2.10.5
fair: ^0.3.0
build_runner: ^1.4.0
fair_compiler: ^0.3.0
from fair.
#151
这个pullrequest应该修复这个问题了,自测可以@FairBinding(packages: ['package:cached_network_image/cached_network_image.dart'])这样引用。
麻烦review一下。 @yancechen
from fair.
Related Issues (20)
- fair_version版本映射缺少组件
- 如果需要下发的动态页面,包含多自定义widget(也需要动态下发),这种情况一般怎么处理,有什么最佳实践吗 HOT 4
- 58同城App有用到Flutter或者Fair库吗? HOT 1
- 生成Js文件本地可以加载,放到服务器后无法加载 HOT 10
- 执行 flutter pub run build_runner build 后,未生成.js文件 HOT 1
- 在Sugar里的表达式,不支持逻辑运算符 ! & |吗? HOT 2
- 热更新需要重启吗 HOT 8
- FairJSBridge是不是有多线程的问题
- 关于 #344 次改动的问题反馈 HOT 2
- Delegate传参问题 HOT 1
- Google Play 合规性问题 HOT 2
- 在iPhone 8 version13.4上 多次刷新偶现页面取值异常 HOT 1
- iOS AppStore合规问题
- 技术交流群有没有可用的,目前无法加入。二维码过期 HOT 2
- 58小助手添加不成功,希望加群了解一下 fair HOT 6
- [Fair] 警告: 不识别的语法节点类型 BinaryExpressionImpl package:musashinobank_flutter/page/home/home_page.dart:163:30: index > 0
- 请问大家用什么状态管理框架
- @FairBinding失效,命令无法生成AppGeneratedModule文件
- Fair已经申请专利,那么使用Fair库会有侵权风险吗? HOT 2
- Fair还正常维护吗?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fair.