Flutter 学习记录
1.bloc使用记录
1)首先我们需要定义三个文件
2)xxx.bloc 发起网络请求获取数据的事件,把数据yield出去
3)xxx.state 根据状态处理UI变化 比如:网络请求success failed progress等 并且携带解析数据传回页面
4)xxx.event 触发事件,比如开始点击,选择菜单,确定取消等
5)初始化一个bloc
例:
import 'package:platform_sdk/platform_sdk.dart';
import 'bloc/bloc.dart';
import 'widget/my_joycoin_widget.dart';
class MyJoycoinPage extends StatelessWidget {
const MyJoycoinPage({Key key}) : super(key: key);
@override
Widget build(BuildContext context) {
return BlocProvider<MyJoycoinBloc>(
create: (BuildContext context) => MyJoycoinBloc(
membershipCenterRepository: PlatformSdk.membershipCnRepository,
)..add(MyJoycoinStarted(pageNumber: 1)),
child: MyJoycoinWidget(),
);
}
}
6)监听bloc接收数据
import '../bloc/bloc.dart';
import 'package:platform_sdk/platform_sdk.dart';
class MyJoycoinWidget extends StatelessWidget {
MyJoycoinWidget({Key key});
@override
Widget build(BuildContext context) {
return BlocListener<MyJoycoinBloc, MyJoycoinState>(
listener: (context, state) {
if (state is MyJoycoinLoadSuccess) {
JoyToast(
'请求成功!',
context,
key: Key('myJoycoinReceivePage_message_joyToast'),
);
}
},
child: BlocBuilder<MyJoycoinBloc, MyJoycoinState>(
key: Key('myJoycoinReceivePage_title_blocBuilder'),
builder: (context, state) {
if (state is MyJoycoinLoadFailure) {
return Scaffold(
body: JoyConnectivityIssue(
key: Key('myJoycoinWidget_failure_joyLoadingIndicator'),
title: "localization.error.connectivityIssueTitle",
description:
" localization.error.connectivityIssueDescription",
retryButtonTitle:
"localization.dealerAppointmentCnStrings.refreshButtonText",
onRetryButtonPressed: () {},
),
);
}
if (state is MyJoycoinLoadInProgress) {
return Scaffold(
body: Center(
child: JoyLoadingIndicator(
key:
Key('myJoycoinWidget_inProgress_joyLoadingIndicator'),
size: 50,
),
),
);
}
if (state is MyJoycoinLoadSuccess) {
var dealerList = state.orderInfo;
return Scaffold(
body: Center(
child: ListView.builder(
key: Key('myJoycoinReceivePage_content_listView'),
itemCount: dealerList.length,
itemBuilder: (context, index) {
var item = dealerList[index];
return JoyListItem(
key: Key('myJoycoinWidget_enabled'),
title: item,
trailingLabel: item,
);
},
physics: AlwaysScrollableScrollPhysics(),
shrinkWrap: true,
)),
);
}
return Container();
}));
}
}
1.flutter插件
fish_redux: 闲鱼团队推出的
cached_network_image: 网络图片、缓存图片
flutter_html: 展示html
image_picker: 选择图片、上传图片(单图)
flutter_webview_plugin: web浏览器,目前在ios有个头部滑动bug
qr_flutter: 二维码生成、解码
photo_view: 图片放大等
dio: 网络数据请求等
fluwx: 微信登录、微信分享等
url_launcher: 打开第三方应用、URL链接
awesome_dialog: 提示框
shared_preferences: 本地信息存储
path_provider: 本地路径
crypto: 编码解码
share_extend: 调起系统分享
multi_image_picker: 选择多图
encrypt: 编码解码
fake_alipay: 支付宝SDK
carousel_slider: 图片滚动,上下左右
webview_flutter: 我个人比较倾向的web浏览器
uni_links: 设置applink、deeplink、scheme等
flui: 骨架屏、加载中等Flutter上使用的UI
fake_push: 腾讯信鸽推送