本插件能够在VSCode上预览DuiLib的XML文件，这样用VSCode编写UI就很方便了
我公司的Windows客户端UI是基于DuiLib的，平时在写UI的过程中，经常需要频繁打开客户端来看查看样式，对我来说就很不方便。我一般用VSCode来写XML，某一天前端同事分享了一个他自己开发的VSCode插件，我就在想，能不能在VSCode上也能够实时预览DuiLib的UI呢。于是我写了一个简单的插件，来实时显示DuiLib UI效果
本插件使用的DuiLib版本基于DuiLib_Ultimate开源项目
插件地址：点我去下载，或者VSCode插件市场搜索：DuiLib UI Preview
本插件已开源，地址：点我去star⭐，觉得好用的朋友，帮忙star一下
使用方法
- 用VSCode打开DuiLib XML文件所在的根目录
- 在XML文件上点击右键，选择DuiLib Preview即可
核心功能如下
-
预览XML文件
-
修改XML文件实时生效
-
多语言预览(请将多语言xml放到language目录下)
-
可预览按钮的不同状态
实现原理
- 根据VSCode提供的API，监控用户选择文件或者用户修改了文件
- 以上行为发生后，VSCode会发送命令给插件，此时插件读取文本内容并将内容传递给XMLToPng.exe命令
- XMLToPng命令是我基于DuiLib写的一个小程序，通过接受标准输入的XML，将XML转换成DuiLib窗口，获取窗口根节点，对根节点设置位置等信息，然后直接调用根节点的渲染操作，将渲染结果转换成base64格式的PNG图片并输出到标准输出上
- VSCode插件读取XMLToPng的标准输出，将结果格式化成HTML并打开VSCode WebView即可