一、插件库官网地址 https://pub-web.flutter-io.cn
Flutter现在用的人越来越多了,经常使用的好看或者实用的轮子,车才能跑的又快又稳。
二、状态管理
响应式的编程框架中都会有一个永恒的主题——“状态(State)管理”,无论是在 React/Vue(两者都是支持响应式编程的 Web 开发框架)还是 Flutter 中,他们讨论的问题和解决的思想都是一致的。所以,如果你对React/Vue的状态管理有了解,可以跳过本节。言归正传,我们想一个问题,StatefulWidget
的状态应该被谁管理?Widget本身?父 Widget ?都会?还是另一个对象?答案是取决于实际情况!以下是管理状态的最常见的方法:
- Widget 管理自己的状态。
- Widget 管理子 Widget 状态。
- 混合管理(父 Widget 和子 Widget 都管理状态)。
状态管理插件:
现在Flutter的状态管理方案很多,比如: redux、bloc、state、provider、Getx。
Provider:Provider 是 Flutter 社区开发的状态管理库,建立在 InheritedWidget 之上,提供了更加便捷的 API 和更灵活的状态管理方式。(推荐)
Getx: 不仅具有状态管理的功能,还具有路由管理、主题管理、国际化多语言管理、Obx局部更新、网络请求、数据验证等功能,相比其他状态管理插件Getx 简单、功能强大并且高性能。(推荐)
Bloc:Bloc 是 Flutter 社区开发的基于流(Stream)的状态管理库,可以将状态和事件分离,并且提供了强大的异步处理能力。
Redux: 遵循严格的单向数据流模式,动作触发状态变更。适合大型复杂应用,对状态的管理较为规范和严格。 (很少用)
StatefulWidget 的 State: 较为基础和简单,直接与特定的 Widget 相关联。适用于较小规模、状态不太复杂的场景
个人推荐:Provider 以及 Getx。
三、网络请求以及数据解析
1、Http请求库-dio
直接使用HttpClient发起网络请求是比较麻烦的,很多事情得我们手动处理,如果再涉及到文件上传/下载、Cookie管理等就会非常繁琐。幸运的是,Dart社区有一些第三方http请求库,用它们来发起http请求将会简单的多
2、数据转model
https://pub.dev/packages/json_serializable
四、Flutter国际化
使用Intl (opens new window)包我们不仅可以非常轻松的实现国际化,而且也可以将字符串文本分离成单独的文件,方便开发人员和翻译人员分工协作。为了使用Intl (opens new window)包我们需要添加两个依赖:
dependencies:
#...省略无关项
intl: ^0.17.0
dev_dependencies:
#...省略无关项
intl_generator: 0.2.1
intl_generator 包主要包含了一些工具,它在开发阶段主要主要的作用是从代码中提取要国际化的字符串到单独的arb文件和根据arb文件生成对应语言的dart代码,而intl包主要是引用和加载intl_generator生成后的dart代码。下面我们将一步步来说明如何使用
五、网页加载以及web容器
https://pub.dev/packages/webview_flutter
https://pub.dev/packages/flutter_inappwebview
整理够了下面自己看吧,回头在补充,借其他人贴的代码,下面基本都是主流的轮子
六、插件整体汇总
provider: ^6.1.1 状态管理
dio: ^5.4.0 网络请求
json_serializable: ^6.7.1 json 格式化
logger: ^2.0.2+1 控制台数据打印
connectivity_plus: ^5.0.2 监听网络状态
getwidget: ^4.0.0 UI框架
card_swiper: ^3.0.1 轮播图
flutter_card_swiper: ^6.1.0 轮播图
package_info_plus: ^5.0.1 APP信息
device_info_plus: ^9.1.1 设备信息
url_launcher: ^6.2.3 打电话发邮件等
flutter_screenutil: ^5.9.0 屏幕适配方案
common_utils: ^2.1.0 常用dart工具类
flustars: ^2.0.1 flutter 工具类
path_provider: ^2.1.2 获取本机文件
flutter_downloader: ^1.11.6 文件下载,视频下载等。
permission_handler: ^11.2.0 权限控制
fluwx: ^4.4.9 调用微信分享,登录,支付
tobias: ^3.3.0 支付宝支付
flutter_cache_manager: ^3.3.1 清理缓存
flutter_slidable: ^3.0.1 tableview cell 左右滑出操作按钮
flutter_native_splash: ^2.3.9 启动屏图片 (一张)
introduction_screen: ^3.1.12 启动后的引导图 (多张)
event_bus: ^2.0.0 事件通知
convex_bottom_bar: ^3.2.0 底部tabbar
animated_bottom_navigation_bar: ^1.3.1 底部tabbar 带动画效果
device_preview: ^1.1.0 真机预览(安卓和苹果各种设备预览)
badges: ^3.1.2 角标
pin_code_fields: ^8.0.1 自定义验证码输入框
upgrader: ^9.0.0 安卓和iOS版本更新
uuid: ^4.3.3 获取UUID
flutter_udid: ^2.0.1 获取UUID
tuple: ^2.0.2 iOS中的元组类型
flutter_svg: ^2.0.9 加载svg资源
lottie: ^3.0.0 加载lottie资源
flutter_launcher_icons: ^0.13.1 自动生成安卓和iOS图标
catcher: ^0.8.0 全局异常捕获 简单好用
底部弹窗和选择 城市选择
sliding_up_panel: ^2.0.0+1 底部弹出框 (普通半屏框 控制高度)
modal_bottom_sheet: ^2.1.2 底部弹出 modal (类似苹果 全屏框)
flutter_picker: ^2.1.0 普通数据的选择
collapsible_sidebar: ^2.0.7 侧边栏弹出 (抽屉)
country_state_city_picker: ^1.2.8 国家选择
city_pickers: ^1.3.0 城市选择
azlistview: ^2.0.0 城市选择
视图动画效果
flutter_staggered_animations: ^1.1.1 指定动画效果 (易)
animations: ^2.0.11 基础动画 (难)
simple_animations: ^5.0.2 单个动画 (难)
自定义控件 按钮 文本
dropdown_button2: ^2.3.9 下拉框按钮
custom_radio_grouped_button: ^2.2.1 radio button数组 多选,单选
animated_text_kit: ^4.2.2 文字动画效果
shimmer: ^3.0.0 闪光效果
circular_menu: ^2.0.1 旋转菜单
flutter_rating_bar: ^4.0.1 评分的展示和评分的点击
flutter_blurhash: ^0.8.2 图片增加高斯模糊
like_button: ^2.0.5 收藏 点赞 按钮
marquee: ^2.2.3 文字滚动组件
auto_size_text: ^3.0.0 文本内容大小自动控制
图片加载和 选择 保存本地
cached_network_image: ^3.3.1 图片加载展示
image_gallery_saver: ^2.0.3 图片保存在本地
multi_image_picker_view: ^1.0.0 多图选择
photo_view: ^0.14.0 图片预览
image_picker: ^1.0.7 本地图片选择 包含相机
wechat_assets_picker: ^8.8.1+1 微信样式的图片选择
image_cropper: ^5.0.1 图片裁剪 处理 (用处少)
extended_image: ^8.2.0 图片的编辑,缩放。支持对图片修改
加载动画
flutter_spinkit: ^5.2.0 加载动画
flutter_easyloading: ^3.0.5 加载等待弹窗
step_progress_indicator: ^1.0.2 进度加载,可控制加载的每个进度
sn_progress_dialog: ^1.1.3 进度条加载框。控制进度
下拉刷新 上拉加载
pull_to_refresh: ^2.0.0 下拉刷新 上拉加载
easy_refresh: ^3.3.4 下拉刷新 上拉加载
infinite_scroll_pagination: ^4.0.0 上拉加载
二维码
qr_flutter: ^4.1.0 生成二维码,解码
flutter_barcode_scanner: ^2.0.0 二维码制作
qr_code_scanner: ^1.0.1 二维码扫描
时间日期选择和转换
omni_datetime_picker: ^1.0.9 年月日 和 时间选择
table_calendar: ^3.0.9 各种日历页面
calendar_date_picker2: ^0.5.3 日历日期多选
syncfusion_flutter_datepicker: ^24.1.46 日历日期多选
jiffy: ^6.2.2 日期转换
dialog
awesome_dialog: ^3.2.0 弹窗提示
adaptive_dialog: ^2.0.0 弹窗提示
flutter_beautiful_popup: ^1.7.0 漂亮的弹窗
flutter_animated_dialog: ^2.0.1 动画弹窗
toast
bot_toast: ^4.1.3 吐司 800星
fluttertoast: ^8.2.4 吐司 3000多星
本地存储
get_storage: ^2.1.1 本地存储
shared_preferences: ^2.2.2 本地存储
加载url 和 html
webview_flutter: ^4.4.4 加载webView
flutter_webview_plugin: ^0.4.0 加载webView
flutter_html: ^2.2.1 加载html
视频播放器
video_player: ^2.8.2 视频播放
chewie: ^1.7.4 视频播放 ,封装的video_player
video_thumbnail: ^0.5.3 获取视频第一帧
音频播放器
audioplayers: ^5.2.1 音频播放器
flutter_sound: ^9.2.13 播放音频以及录音功能
高德地图定位
amap_flutter_map: ^3.0.0 高德地图
amap_flutter_location: ^3.0.0 高德定位
amap_map_fluttify: ^2.0.2 高德地图插件
map_launcher: ^3.1.0 跳转其他地图APP
flutter_map: ^6.1.0 地图
图表
fl_chart: ^0.66.0 图表 5000星
业务方面的第三方
flutter_local_notifications: ^16.3.1+1 本地通知
flutter_app_badger: ^1.5.0 APP图标上的角标
geolocator: ^10.1.0 获取当前定位 (谷歌定位,中国不能用)
lpinyin: ^2.0.3 文字转拼音
flutter_image_compress: ^2.1.0 图片压缩,用于选择本地图片上传时
decimal: ^2.3.3 高精度浮点数
animated_background: ^2.0.0 动态背景
flutter_draggable_gridview: ^0.0.9 可拖拽的集合按钮
slide_to_act: ^2.0.2 可拖拽的按钮,拖拽完成解锁
flutter_login: ^5.0.0 自定义的登录页面
flutter_bugly: ^0.4.4 bug收集
install_plugin: ^2.1.0 apk安装,跳转App Store
skeletonizer: ^1.0.1 骨架图。客户需要的时候才用
sleek_circular_slider: ^2.0.1 圆形滑动条
flutter_speed_dial: ^7.0.0 可展开选项的浮动按钮
group_button: ^5.3.4 按钮数组 可选择
dotted_border: ^2.1.0 给组件添加虚线框
sqflite: ^2.3.0 本地数据库
intl: ^0.19.0 国际化翻译
battery_plus: ^5.0.2 获取电池电量
expansion_tile_card: ^3.0.0 卡片展开
local_auth: ^2.1.8 #生物身份识别(Touch ID 和 Face ID)
sticky_headers: ^0.3.0+2 header 吸顶
screenshot: ^2.1.0 包裹的内容进行截图
flutter_keyboard_visibility: ^6.0.0 键盘监听
keyboard_actions: ^4.2.0 键盘上的事件 done
sign_in_with_apple: ^5.0.0 苹果登录
推送和分享
mobcommonlib: ^1.1.5 mob分享基础库
mobpush_plugin: ^1.2.5 mob推送 比 极光推送 好
sharesdk_plugin: ^1.3.10 mob分享
jpush_flutter: ^2.5.0 极光推送
getuiflut: ^0.2.25 个推 ,用的少```