十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
2017年底因公司业务组合部门调整,新的团队部分维护的项目用React Native技术混合开发。为适应环境变化,开启疯狂RN学习之旅,晚上回来啃资料看视频。可能由于本身对RN技术体验不感冒或者在环境之下强迫学习有点不爽。开始寻找代替方案,Fluter像一束曙光引起了我的注意,之后一直关注并利用闲余时间开始探索。2018年一直学习到使用Flutter写项目,从0.2.0开始到现在1.5版本的发布,终于开始慢慢的爬出坑位了,但是因为部分控件感觉还是不如原生控件好用,因而Flutter提供了PlatformView部件。近期因项目中严重使用依赖地图,故而做了Fluterr使用原生IOS高德地图调研。因为我本身是一名android开发人员,初学IOS并记录下来。
网站建设哪家好,找成都创新互联公司!专注于网页设计、网站建设、微信开发、微信小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了锦江免费建站欢迎大家使用!
PlatformView是 flutter 官方提供的一个可以嵌入 Android 和 iOS 平台原生 view 的小部件。
在我们实际开发中,我们遇到一些 flutter 官方没有提供的插件可以自己创建编写插件来实现部分功能,但是原生View在 flutter 中会遮挡住flutter 中的小部件,比如你想使用高德地图sdk、视频播放器、直播等原生控件,就无法很好的与 flutter 项目结合。
1、info.plist文件设置
2、 ios 端实现原生组件PlatformView提供原生view
3 、ios 端创建PlatformViewFactory用于生成PlatformView
4、 ios 端创建FlutterPlugin用于注册原生组件
5 、flutter 平台嵌入 原生view
iOS端的UiKitView目前还只是preview状态, 默认是不支持的, 需要手动打开开关, 在info.plist文件中新增一行io.flutter.embedded_views_preview为true.
创建类 FlutterMapView 并实现FlutterPlatformView 协议
FlutterMapView.h
FlutterMapView.m
FlutterMapFactory.h
FlutterMapFactory.m
FlutterMapPlugin.h
FlutterMapPlugin.m
请前往 高德开放平台控制台 申请 iOS Key。
注意:Bundle Identifier需要与申请的时候填写的一致
地图依赖的库列举如下:
基础 SDK AMapFoundationKit.framework
第一步:将解压后的MAMapKit.framework 文件 copy 或 拖拽 到工程文件夹中,左侧目录选中工程名,在 TARGETS-Build Phases- Link Binary With Libaries 中点击“+”按钮,在弹出的窗口中点击“Add Other”按钮,选择工程目录下的 MAMapKit.framework 文件添加到工程中。
千万不要忘记将AMapFoundationKit也一起加入工程。
3D地图正确配置应如下图所示:
需要引入的资源文件包括:AMap.bundle,其中:AMap.bundle 在 MAMapKit.framework 包中,AMap.bundle资源文件中存储了定位、默认大头针标注视图等图片,可利用这些资源图片进行开发。
左侧目录中选中工程名,在右键菜单中选择Add Files to “工程名”…,从MAMapKit.framework中选择AMap.bundle文件,并勾选“Copy items if needed”复选框,单击“Add”按钮,将资源文件添加到工程中。
成功跑起来 。。 。
flutter用一个插件进行icloud。
拓展资料:为何flutter构建的App体积较大?
细心的开发者会发现flutter构建的App体积比native的大一些,是什么原因造成App体积大呢?
其实flutter 在release时App体积和native的大小差不多,而debug时体积通常会大。debug版本体积较大是为了Hot reload和快速编译。如果有flutter开发经验的朋友都体验过,如果您修改一下App的背景颜色,只需save一下就可以立刻看到修改后效果。我称之为“像艺术家一样在创造App”,因此为了实现这些目标,提高开发的效率,debug将占用全部资源。而当我们构建release版时,flutter又会采用AOT策略,提高App运行效率,release版只打包必需的资源,因而体积又会减少。
另外,flutter团队也一直在寻找减小程序大小的方法。
标准的Flutter App工程,包含标准的Dart层与Native平台层
Flutter平台插件工程,包含Dart层与Native平台层的实现
Flutter纯Dart插件工程,仅包含Dart层的实现,往往定义一些公共Widget
参考资料:
针对日常不同的需求,我们时常需要自定义 Dialog ,而小菜在尝试过程中遇到一些小问题,简单记录总结一下;
小菜在自定义含有文本框的 Dialog 时,文本框获取焦点时,软键盘会部分遮挡对话框,但当小菜替换为 AlertDialog 时,文本框获取焦点时,对话框会向上浮动,避免软键盘遮挡;
对于含有文本框的自定义 Dialog ,小菜在最外层使用的是 Material 嵌套,小菜通过采用 Scaffold 来嵌套处理,默认 Scaffold 中 resizeToAvoidBottomPadding / resizeToAvoidBottomInset 为 true ,当设置为 false 时,文本框获取焦点时,依旧会被软键盘遮挡;因为在固定情景可以配合 resizeToAvoidBottomPadding 实现是否被软键盘遮挡效果;
resizeToAvoidBottomPadding 主要用于自身 Widget 是否避免被其他窗口遮挡;其中小菜查资料介绍在 Flutter 1.1.9 之后更推荐使用 resizeToAvoidBottomInset ;
小菜自定义一个可以多选 item 的 Dialog ,但 Dialog 中并没有状态更新的 State ,如何进行 Dialog 中状态更新呢?
小菜之前在 showDialog 时直接创建了 TypeListDialog ,此时是无状态的,当 WidgetBuilder 创建一个 StatefulBuilder 有状态的构造器即可,可以将 state 传递到 Dialog 中;
小菜在自定义 Dialog 时如何在一个回调方法中传递多个参数?
小菜在 Dialog 的回调方法中传递两个 List ,而在接收回调方法中匹配两个参数即可;小菜简单看作是一个函数方法;
小菜在重写 AppBar 时,如何取消默认的返回按钮?
取消 AppBar 前面的返回图标有多种方式;
自定义 Dialog 案例源码
小菜对于 Flutter 的应用还不够熟悉,很多常用的场景会处理的很不到位,小菜会对日常的小问题进行简单记录,逐步学习;如有错误,请多多指导!