WPF + CEF 打造物联网边缘计算的强大UI开发工具

381 阅读4分钟

前言

IoTBrowser用于开发人机界面(HMI)或数据采集与监督控制系统(SCADA) 的工具,使用HTML或Vue前端技术开发物联网终端用户界面,支持串口、RFID、电子秤等硬件协议,支持js控制关机、全屏等工控操作。

软件介绍

基于Chromium内核的高效工控系统界面开发

利用基于Chromium内核的HTML5(H5)技术,前端开发人员能够快速构建高效的人机界面(HMI)和数据采集与监督控制系统(SCADA)。

通过集成丰富的JavaScript API,不仅能够实现精美的用户界面展示,还能直接控制包括串口、RFID、电子秤等在内的多种硬件设备。

该系统支持二次定制开发,满足特定应用需求。

核心优势

快速开发:使用H5或Vue.js进行前端开发,缩短项目周期。

硬件兼容:内置对多种工业标准协议的支持,简化硬件集成。

灵活部署:既可本地打包为离线应用,也可在线加载Web网页,适应不同应用场景。

全面控制:提供强大的JS API,用于界面展示和硬件控制。

定制化开发:支持二次开发,确保系统可以根据具体需求进行扩展和优化。

转存失败,建议直接上传图片文件

软件框架

项目基于 WPF + Chromium (CEF) + Web API 开发,为 Windows 7 系统提供高效、响应迅速的应用程序解决方案。

源代码完全开源,适合开发者进行二次开发和定制。

WPF :用于用户界面,支持丰富的图形效果和交互体验。

Chromium Embedded Framework (CEF):嵌入式浏览器内核,确保应用能够流畅运行现代Web内容。

Web API:提供后端服务接口,便于前后端分离和数据交互。

开发工具:Visual Studio 2019

桌面开发工作负载(Desktop development with C++)

.NET Framework 4.6.2 或更高版本

软件使用

1、配置文件

转存失败,建议直接上传图片文件

2、代码目录

转存失败,建议直接上传图片文件

3、二次开发和打包

HBuilderX开发

a、导入目录

转存失败,建议直接上传图片文件

转存失败,建议直接上传图片文件

b、双击运行

转存失败,建议直接上传图片文件

c、修改代码

转存失败,建议直接上传图片文件

修改文件并保存

右击调出右击菜单点击刷新,或者使用快捷键F5即可快速刷新查看修改后效果

VS 下开发和打包

a、修改图标

转存失败,建议直接上传图片文件

替换logo.ico

F5 运行即可

转存失败,建议直接上传图片文件

生成打包exe

转存失败,建议直接上传图片文件

注意:发行只要需要exe文件,此exe为免安装版,运行目录就是安装目录。

提示

win10及win11下载文件exe权限受限,需要参考下图。

否则运行失败!!!

转存失败,建议直接上传图片文件

功能效果

1、窗口界面能力

常用的功能界面全屏、设置屏幕大小等。

2、系统应用能力

常用的功能界面系统关机、设置标题、设置图标等。

使用F12快捷键可以快速调起开发者工具,方便调试前端功能。

管理密码为:123

3、Web串口调试

Web串口调试,使用WebSocket双向通讯,实时采集并展示到界面。

可以借助echarts、three.js等前端界面框架实现漂亮界面。

工具地址

Gitee:gitee.com/yizhuqing/I…

总结

希望这个物联网工具,能够帮助大家提高开发效率,简化开发流程。更多实用功能,请查看工具地址。

通过本文希望能为大家在物联网开发方面提供有价值的参考。欢迎在评论区留言交流,分享您的宝贵经验和建议。