AHK v1 做 GUI,传统控件够轻量,但做现代界面时会比较吃力。以前很多人会用 IE 控件,问题是 IE 太老,现代 CSS、JS、布局能力都跟不上。现在更现实的方向,是把 WebView2 当成 AHK GUI 的前端容器。
WebView2AHK 是一个 AHK v1 的 WebView2 容器骨架库。它可以把 Edge Chromium WebView2 嵌入 AHK GUI,用 HTML、CSS、JS 做界面,再让 AHK 负责本地自动化能力。
它现在能做什么
- 在 AHK GUI 里创建 WebView2 控件。
- 打开在线 URL。
- 直接渲染 HTML 字符串。
- 打开本地 HTML 文件。
- 窗口缩放时自动调整 WebView2 大小。
- 打开开发者工具,方便调试前端页面。
- 查询系统 WebView2 Runtime 版本。
- 配合 AHKhttp,把本地 HTTP 服务页面嵌入窗口。
最小示例
#Requires AutoHotkey v1.1
#Include <WebView2AHK>
Gui, New, +Resize +HwndMainHwnd, WebView2AHK 示例
Gui, Show, w980 h680
view := new WebView2AHK(MainHwnd)
view.NavigateToString("Hello WebView2AHK")
return
GuiSize:
if (IsObject(view))
view.Resize()
return
GuiClose:
ExitApp
依赖要说清楚
这个库不是纯 AHK 零依赖。系统需要 Microsoft Edge WebView2 Runtime,脚本还需要对应位数的 WebView2Loader.dll。U32 版本 AHK 用 x86 DLL,U64 版本 AHK 用 x64 DLL,位数不匹配就会创建失败。
WebView2UserData 是运行数据目录,用来保存缓存、Cookie、LocalStorage 等内容。做项目时最好给每个工具单独设置,后期排查缓存问题也方便。
适合什么场景
我更推荐把它用于“AHK 本地能力 + 网页界面”的工具:配置页、管理面板、表单录入、数据展示、Canvas 可视化、本地 AHKhttp 页面。HTML/CSS/JS 负责界面,AHK 负责文件、窗口、键鼠、系统自动化。
不要把它当完整 Electron
目前这个库更像可用骨架,不是完整应用壳。它还没有完整事件系统、AHK 和 JS 双向通信封装、下载管理、权限控制、新窗口管理这些高级功能。网页自动化也不建议用它硬做,那类需求更适合 AHKChrome、Selenium 或 HTTP 请求。
如果你只是想摆脱 IE 控件,用更现代的 HTML/CSS 做 AHK 界面,这个库已经有参考价值。如果你想做一个完整桌面应用框架,还需要继续扩展。
打包库和示例的下载地址:
demo代码片段展示:
下面是 demo.ahk 的完整结构展示。因为示例里包含一段 HTML 页面代码,部分 HTML 标签在文章中做了全角化展示,实际文件以下载包里的 demo.ahk 为准。
#NoEnv
#Persistent
#SingleInstance, Force
SetBatchLines, -1
SetWorkingDir, %A_ScriptDir%
#Include <WebView2AHK>
version := WebView2AHK_RuntimeVersion()
if (version = "") {
MsgBox, 16, WebView2AHK 示例, 没有检测到 Microsoft Edge WebView2 Runtime。`n请安装微软官方 WebView2 Runtime 后再运行。
ExitApp
}
Gui, New, +Resize +MinSize700x480 +HwndMainHwnd, WebView2AHK 本地HTML示例
Gui, Margin, 0, 0
Gui, Show, w980 h680
html =
(LTrim
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
:root { color-scheme: light dark; }
body {
margin: 0;
font-family: "Microsoft YaHei UI", "Segoe UI", sans-serif;
background: #f6f7fb;
color: #1f2937;
}
main {
padding: 32px;
max-width: 980px;
margin: auto;
}
.grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: 14px;
margin-top: 18px;
}
.card {
background: white;
border: 1px solid #d9dee8;
border-radius: 8px;
padding: 18px;
box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
}
button {
border: 0;
background: #2563eb;
color: white;
border-radius: 6px;
padding: 10px 14px;
font-size: 14px;
}
code {
background: #eef2ff;
padding: 2px 6px;
border-radius: 4px;
}
</style>
</head>
<body>
<main>
<h1>WebView2AHK 容器骨架</h1>
<p>这是 AHK v1 的 GUI 窗口,里面嵌入的是 Edge Chromium WebView2 控件。</p>
<p>当前 Runtime:<code>%version%</code></p>
<button onclick="document.querySelector('#now').textContent = new Date().toLocaleString()">运行 JavaScript</button>
<p id="now"></p>
<section class="grid">
<div class="card"><h3>现代 HTML</h3><p>支持 CSS Grid、现代 JS、字体、动画等能力。</p></div>
<div class="card"><h3>本地界面</h3><p>可以直接 <code>NavigateToString()</code>,也可以导航到本地 HTTP。</p></div>
<div class="card"><h3>不改 AHKhttp</h3><p>HTTP 服务库保持独立,这个库只负责 GUI 容器。</p></div>
</section>
</main>
</body>
</html>
)
global WV := new WebView2AHK(MainHwnd)
WV.NavigateToString(html)
Return
GuiSize:
if (IsObject(WV))
WV.Resize()
Return
GuiClose:
ExitApp

评论(0)