可以找第三方服务商,比如即构科技,他们的互动直播解决方案挺不错的,支持Java、React Native、JavaScript 、Swift、Electron、Flutter等多种语言框架。搭建起来很快速,四行代码即可接入。
专注于为中小企业提供网站设计制作、成都做网站服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业鹤峰免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了千余家企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。
flutter作为一个相对来说比较新兴的框架,相比于其他框架来说避免不了存在生态不完善的问题。要想实现flutter直播,可以接入即构科技的Express Flutter SDK,然后通过集成、初始化SDK、登录房间服务器、用户推送自己的本地音视频、拉取远端的音视频流等简单五个步骤实现简单的实时音视频场景进行直播。
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”按钮,将资源文件添加到工程中。
成功跑起来 。。 。
提前申请和准备要要用的证书
用HBuilderX打正式包。
1)要在manifest.json里面配置App图标和启动图片
2)App图标尺寸:png 格式图片 256*256
启动图片尺寸:png 格式图片 480762 7201242 1080*1882
3. app上架材料梳理:
一般看个人要求,在腾讯、华为、小米各个平台上线。
每个平台都要注册开发者账号,用企业信息注册,注意开发者账号公司和软著要一致,否则华为、腾讯会让你重新按软著上的公司名称注册开发者账号。小米要提供一个代理授权书。
1)共同提交的材料:
1.公司名称
2.公司营业执照、其中百度需要营业执照复印件并且在文字的地方加盖公章。
3.企业法人身份证照片(正反两面),其中百度另外要求上传手持身份证照片(正反两面)。
4.企业对公账号,其中华为和小米打钱验证,利用金额进行验证。
5.企业地址。
2) 提交应用审核资料:
1.软著,jpg,png,pdf,3种格式。
2.企业营业执照,pg,png,pdf,种格式。
3.图标,尺寸不一致。216216 jpg 512512 jpg
4.应用内截图,多截几张,最后用测试账号截图。
5.应用简介和应用描述。
9.icp备案截图。
7.如果软著公司和开发者账号不一致,需要提供代理授权书,签字盖章。
8.隐私政策网址。
上架成功后需要在各个商城自行下载。
腾讯课堂14M
今日头条3M
闲鱼22M
百度贴吧13M
蚂蚁财富56.8M
百度网盘14M
手机淘宝15M
贝壳找房8M
由粗粒度小组件动态拼装出页面,Native端已经有很多成熟的框架,如天猫的Tangram。
开发语言:iOS、Android
适用场景:快速迭代的活动营销页面
优点:无侵入,更新简单
缺点:提前预埋,扩展性差,灵活性差
以webview作为容器的app,历史悠久,最早到2011年。
开发语言:HTML
适用场景:双端严格一致的银行类app,容器类的支付宝小程序等
优点:动态更新,跨平台
缺点:性能,加载速度
UI用Xml+JS表达,用Native View渲染。
开发语言:Xml+JS
适用场景:双端严格一致的银行类app,容器类的支付宝小程序等
优点:native组件,生态成熟
缺点:三方库crash,性能缺陷
UI用Dart表达,用Dart engine渲染。
Flutter官方不支持动态化。原因是Flutter在 Release 模式下构建的是 AOT 编译产物,在 Debug 模式下构建的是 JIT ,AOT 依赖的 Dart VM 和 JIT 并不一样, JIT Release 并不支持 iOS 设备。可行的方案是:AOT 需要一个编译后的 “Dart VM”。抽离一份 DartVM 独立编译,再以动态库的形式引入项目。
开发语言:Dart
适用场景:iOS、Android、Web、Desktop、Embed
优点:性能最佳
缺点:增大包体积 20MB+
大厂的主流方案。UI用JS表达,用Dart engine渲染。
开发语言:JS、类JS
适用场景:iOS、Android
优点:性能最佳
缺点:需要掌握JS、Dart两个语言和框架
大厂的主流方案。UI用Dart表达,用Dart engineX渲染。
开发语言:Dart
适用场景:iOS、Android
优点:性能最佳
缺点:需要改造Dart engine
1、 美团外卖Flutter动态化实践
2、 携程App 首页动态化探索
3、 Flutter 动态化在最右 App 中的实践
4、 Flutter 动态化热更新的思考与实践
5、 NOW直播Flutter动态搜索列表页实现
6、 Flutter动态化的方案对比及最佳实现-闲鱼
7、 基于JavaScript 的MXFlutter
透明视频动画是目前比较流行的实现动画的一种, 大厂也相继开源自己的框架,最终我们选中 腾讯vap ,它支持了Android、IOS、Web,为我们封装flutter_vap提供了天然的便利,并且它提供了将帧图片生成带alpha通道视频的工具,这简直太赞了。
VAP(Video Animation Player)是企鹅电竞开发,用于播放酷炫动画的实现方案。
video for youtube
video for qiniu
apk download
github