Flutter window和Mac中webview2使用Cef替代

目前主流是使用 webview2,并且以实例的方式启动,无法作为widget组件在Flutter应用中内嵌,只能以新窗口的形式打开,体验不是很友好 也不太符合大多数软件开发的需求要求。

这里使用CEF(Chromium Embedded Framework)来替代webview2的方案,CEF是基于 Chrome Chromium 的一个开源内核,Google官方并未提供flutter版本的CEF,需要自己使用C++编写cpp去实现接口能力 或者使用第三方作者封装的依赖库。

目前接入有2种方式
  1. C++编写原生cpp + Flutter Plugin的形式接入

接入相对复杂、原生配置和 编写3端的代码量非常大(Windows端 C++;Mac端 Objective-C或swift;Flutter)

  1. 使用pub仓库中的一个大佬封装的CEF库(点击 webview_cef 查阅),这个方式较为便捷 也满足大多数要求

本文仅分享webview_cef的使用案例 不讨论C++形式。 这个库已经实现了大部分常用接口能力,当然 您C++能力过硬并且比较闲,也可以自己编写 C++ cpp的方式接入CEF。

接入案例

1、在 pubspec.yaml 中引入webview_cef

2、 在windows\runner\main.cpp中初始化 initCEFProcesses()

3、 ::MSG msg; 中加入 handleWndProcForCEF()启用 CEF 键盘输入推送

4、flutter run 即可,首次编译会下载 cef资源包,文件较大,会比较慢,等待即可

嵌入示例运行效果

相关推荐
向哆哆18 小时前
构建健康档案管理系统:Flutter × OpenHarmony 跨端实现就医记录展示
flutter·开源·鸿蒙·openharmony·开源鸿蒙
风清扬_jd18 小时前
libtorrent-rasterbar-2.0.11编译说明
c++·windows·p2p
2601_9498683620 小时前
Flutter for OpenHarmony 电子合同签署App实战 - 主入口实现
开发语言·javascript·flutter
向哆哆20 小时前
画栈 · 跨端画师接稿平台:基于 Flutter × OpenHarmony 的整体设计与数据结构解析
数据结构·flutter·开源·鸿蒙·openharmony·开源鸿蒙
虚心低调的tom21 小时前
Moltbot 助手在 Windows 10 上安装并连接飞书教程
windows·飞书·moltbot
2601_9498333921 小时前
flutter_for_openharmony口腔护理app实战+我的成就实现
flutter
2601_9496130221 小时前
flutter_for_openharmony家庭药箱管理app实战+用药知识详情实现
android·javascript·flutter
一起养小猫21 小时前
Flutter for OpenHarmony 实战 表单处理与验证完整指南
android·开发语言·前端·javascript·flutter·harmonyos
2601_9499750821 小时前
flutter_for_openharmony城市井盖地图app实战+附近井盖实现
android·flutter
向哆哆1 天前
构建 Flutter × OpenHarmony 跨端健康档案管理顶部横幅的实现与解析
flutter·开源·鸿蒙·openharmony