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资源包,文件较大,会比较慢,等待即可

嵌入示例运行效果

相关推荐
love530love5 分钟前
如何在 Google Chrome 中强制开启 Gemini AI 侧边栏(完整图文教程)
前端·人工智能·chrome·windows
skilllite作者7 分钟前
Zed 1.0 编辑器深度评测与实战指南
开发语言·人工智能·windows·python·编辑器·agi
杜哥无敌9 分钟前
FreeSSHd vs FileZilla Server vs SFTPGo:Windows SFTP服务器易用性终极横向测评
运维·服务器·windows
maaath14 分钟前
【maaath】 Flutter for OpenHarmony 快捷工具箱应用实战开发
flutter·华为·harmonyos
wangbing112515 分钟前
_MACOSX目录是什么
mac
maaath21 分钟前
【maaath】Flutter for OpenHarmony 实战:茶叶茶艺应用开发详解
flutter·华为·harmonyos
李白的天不白21 分钟前
vue 数据格式问题
前端·vue.js·windows
maaath32 分钟前
【maaath】Flutter for OpenHarmony 的手办展示应用开发实践
flutter·华为·harmonyos
jiejiejiejie_12 小时前
Flutter for OpenHarmony 心情日记功能实战指南
flutter·华为
love530love12 小时前
精简版|Claude-HUD 插件介绍 + 一键安装教程
人工智能·windows·笔记