TecNico
(xianii)
1
AHK WebView Template
一个基于 vite + tailwindcss 的 AutoHotkey WebView 模板。
简介
以下为模板自带的示例界面：
这个模板使用 WebViewToo 作为 webview 包装器，并结合 vite 构建了一个支持前端热重载的 AHK WebView GUI 开发框架。在这个框架下，你可以使用各种现代前端技术为你的 AHK 应用创建惊艳的图形界面与交互。
在模板的界面上，点击 Hello WebView 标题即可拖动整个窗体。
左边的输入框是一个示例，展示了如何从前端向 AHK 脚本发送消息。在输入框中输入任意字符串并点击发送，AHK 脚本将使用 Msgbox 方法打印出该字符串。
右边的输入框是一个示例，展示了如何从 AHK 脚本向前端发送消息。按下热键 F1，AHK 脚本将循环发送几个预设的字符串至前端。
下方是一个完全在前端构建的计数器，不与 AHK 脚本交互。
特性
项目正处在开发的早期阶段，各种特性与表现都可能发生变化。
本模板使用了 vite 来编译前端组件和提供 dev server，使得在开发过程中，前端界面可以进行热重载，在AHK上获得前所未有的现代开发体验。
模板默认引入了 TailwindCSS ，使得对前端不太熟悉的 AHK 开发者也能比较轻松的完成界面样式的设计。而且模板与前端框架没有强绑定，开发者也可以使用任何自己熟悉的前端技术栈来进行开发。
2 个赞
大佬也太强了吧！直接弥补AHK显示空白，不过我用ahk用的少，想请问一下这个语言和python比有啥优势啊
TecNico
(xianii)
3
正如其名AutoHotkey，AutoHotkey 在 Windows 上热键相关和模拟键鼠输入上面具有开发非常简单和快速的优势。编译的二进制也比较小巧。我之前有发布的AHK写的应用大多体积都在 1Mb 以下。
TecNico
(xianii)
4
TecNico
(xianii)
6
更新
首个正式发布版本
AHK WebView Template — 用 AutoHotkey v2 + Web 技术构建现代化桌面 GUI
如果你一直想给 AHK 脚本打造一个现代化、精致的界面，又不想受制于传统 AHK GUI 控件的局限，这个模板就是为你准备的。
这是什么？
一个开箱即用的项目模板，将 AutoHotkey v2 与现代 Web 前端（Vite 7 + TailwindCSS v4 + DaisyUI v5）结合，通过 WebViewToo 在 AHK 窗口中渲染。你用 AHK 编写逻辑，用 HTML/CSS 设计界面，两者之间通过简单的 JSON 消息通信。
为什么选择它？
- 现代化 UI，无框架锁定 — 使用 TailwindCSS 工具类和 DaisyUI 组件（开关、滑块、弹窗、图表、统计卡片等），告别 AHK 内置 GUI 控件的各种限制
- 热重载开发 — 前端修改即时反映到 WebView 窗口；按
F6 重载 AHK 脚本，无需手动重启
- 双向消息传递 — AHK ↔ 前端通过 JSON 消息通信。从 UI 发送数据到 AHK 回调，或从 AHK 推送更新到 Web 前端
- 一键构建 —
npm run build 将所有内容编译为独立 .exe，资源内嵌，运行时无需外部文件
- 组件化架构 —
frontend/components/ 中的 HTML 片段通过 <load> 标签加载，保持 UI 模块化和可复用
- 简洁工作区模式 — 运行
npm run init 清除所有演示内容，从最小化的单页模板开始开发
包含哪些内容？
4 个演示页面，展示不同的 UI 模式：
| 页面 |
演示内容 |
| 消息传递 |
前端 → AHK（Msgbox）和 AHK → 前端（F1 热键） |
| 注册示例 |
DaisyUI 表单组件，带背景图片 |
| 控件示例 |
开关、滑块、进度条、下拉框、步进器、评分、复选框 |
| DaisyUI 示例 |
统计卡片、带工具栏的文章编辑器、柱状图 |
快速开始
# 前置条件：Node.js (LTS) + AutoHotkey v2 (64-bit)
npm install
npm run dev
- 前端保存后自动热重载
- 按
F6 重载 AHK
- 按
Ctrl+C 退出
技术栈
| 层级 |
技术 |
| 桌面包装器 |
AutoHotkey v2 (64-bit) + WebViewToo |
| 构建工具 |
Vite 7 |
| CSS |
TailwindCSS v4 + DaisyUI v5 |
| AHK CLI |
ahk64 |
链接
欢迎反馈、Issue 和 PR！
2 个赞
