北京金融网站建设,企业建站的费用,广州品牌seo网站推广,佛山网站制作好处文章目录 flutter(桌面端)瓶颈一、Flutterthree.js二、Flutterthree.js 实现思路1.在Flutter 中使用webview 进行嵌套2.开启上面嵌套的页面地址2.在含有three.js 的html 中引入模型3.两个页面之间进行通信#xff0c;如图#xff1a; 总结 flutter(桌面端)瓶颈
Flutter 本身… 文章目录 flutter(桌面端)瓶颈一、Flutterthree.js二、Flutterthree.js 实现思路1.在Flutter 中使用webview 进行嵌套2.开启上面嵌套的页面地址2.在含有three.js 的html 中引入模型3.两个页面之间进行通信如图 总结 flutter(桌面端)瓶颈
Flutter 本身并不直接支持 3D 桌面应用程序的开发 Flutter 使用的是自己的渲染引擎Skia它旨在高效地处理 2D 绘制和界面构建而不是 3D 图形渲染。Skia 是一个强大的 2D 渲染库但它没有为复杂的 3D 场景优化因此 Flutter 本身对 3D 的支持较弱。因此如果想在flutter 中实现3d模型并实现交互则需要用别的方式。
一、Flutterthree.js
这种方式我是比较推荐的如果你是前端的开发者用这种方式可以很快的上手实现。先来看一下整体的视频效果 视频效果
图片效果 即用不同的按钮控制模型的样式一个按钮是为模型添加皮肤一个按钮是可以正向旋转模型一个按钮是可以反向旋转模型另一个按钮是可以在模型的指定位置添加自己定义的数字。
占用的性能:
二、Flutterthree.js 实现思路
1.在Flutter 中使用webview 进行嵌套
这个方法就好比前端的iframe 一样即页面中嵌套页面具体的部分代码结构如下
2.开启上面嵌套的页面地址
如果你有vscode ,可以用快捷的开启方式 这样子就可以开启以这个页面为服务的地址为啥要用这种方式呢而不直接点击呢因为如果你直接使用点击的话可能有些资源加载不出来若果你没有vscode,你也可以用node,或者java 命令行来开启服务。
2.在含有three.js 的html 中引入模型
如图 这边你需要提供一下模型的obj,或者别的方式可以从uniyt 中去生成也可以从Blender 可以用于创建 3D 模型并将模型导出为常用的 3D 文件格式比如 OBJ 或 FBX如果没有这方面的知识可以试着从网上找一些模型先代替一下。
3.两个页面之间进行通信如图
在flutter 中发送命令
在three.js的页面中接受发出的信号
总结
这里只是展示了一种方式其实还有很多的方式可以实现桌面端的3d,例如 1Flutter Unity (flutter_unity_widget),通过 flutter_unity_widget 插件将 Unity 的内容嵌入到 Flutter 应用中并在桌面端显示。 2Flutter OpenGL可以使用 flutter_gl 或 dart:ffi外部函数接口来调用本机的 OpenGL 库并在 Flutter 桌面应用程序中展示 3D 模型。这种方式需要通过 OpenGL 直接在窗口中绘制 3D 场景。
只要勤加思考肯定是都有方法去解决的没有解决不了的事情只有不会解决的人。
如需项目demo微信扫下面的二维码注册成功到下面的我的-联系客服 问我要代码
